title: Is there any way to make this flood fill faster in HTML5 canvas?
body: <p>I'm using <a href="http://www.williammalone.com/articles/html5-canvas-javascript-paint-bucket-tool/" rel="nofollow">this tutorial right now</a> and I got it working perfectly, but my only concern is that it's a bit slow. I have a 600x600 canvas and when using the fill tool it will take about 2 seconds to fill the canvas. In Microsoft Paint to fill a canvas of the size is instant and to fill a canvas 10x that size (6000x6000) is still slightly shorter at around 1 second.</p>
  
  <p>Is this just a limitation of javascript and the canvas element or could it be optimized to be near the speeds of desktop programs like MS Paint? I profiled it with Firebug and this function seems to be one of the main bottlenecks, but it does have to run every iteration so..</p>
  
  <pre><code>function matchStartColor(pixelPos, startR, startG, startB) {
      var r = colorLayerData.data[pixelPos];
      var g = colorLayerData.data[pixelPos + 1];
      var b = colorLayerData.data[pixelPos + 2];
  
      return (r == startR &amp;&amp; g == startG &amp;&amp; b == startB);
  } 
  </code></pre>