title: Fabricjs: When I apply and re-apply Image filters, Image quality went down
body: <p>I have applied invert, grayscale and other filters in my image using fabricjs and the image quality is going to down and then. please see the code below and let me know if any issue with the code. I am using the image (img) as pattern to fill the rectangle.</p>
  
  <pre><code>var filters = ['brightness','grayscale', 'invert', 'sepia', 'sepia2','blur', 'sharpen'];
  
  var applyFilter = function(index, filter) {
      img.filters[index] = filter;
      img.applyFilters(canvas.renderAll.bind(canvas));
  }
  
  var applyFilterValue = function(index, prop, value) {
      if (img.filters[index]) {
      img.filters[index][prop] = value;
      img.applyFilters(canvas.renderAll.bind(canvas));
      }
  }
  
  img.filters[0] = new filter.Brightness({'brightness': 0});
  
  $('body').on('click', '#blackwhite', function() {
      applyFilter(1, this.checked &amp;&amp; new filter.Grayscale());
  });
  $('body').on('click', '#invert', function() {
      applyFilter(2, this.checked &amp;&amp; new filter.Grayscale());
  });
  </code></pre>