title: Using Web Workers for drawing using native canvas functions
body: <p>It's possible to send a <code>CanvasPixelArray</code> obtained via <code>getImageData</code> to a worker script, and let the worker script manipulate the pixels in its background thread, and eventually post the manipulated pixel array back.</p>
  
  <p>However, I'm using native canvas drawing functions, like <code>drawImage</code>. The <code>drawImage</code> calls are currently blocking the UI thread. This causes slow redraw of buttons, and a noticeable delay when clicking on a button, just to name a few drawbacks. (Edit: A small improvement can now be accomplished with <code>ctx.imageSmoothingEnabled = false</code>, at least on WebKit with the <code>webkit</code> prefix.)</p>
  
  <p>I'd like to move the drawing from the main thread into a background thread using Web Workers. However, I don't seem to be able to send the canvas nor the context to the worker.</p>
  
  <p>I did find <a href="https://developer.mozilla.org/en/Using_web_workers#Passing_data">this notice on MDN</a>:</p>
  
  <blockquote>
    <p>Note: As usual, background threads—including workers—cannot manipulate the DOM.  If actions taken by the background thread need to result in changes to the DOM, they should post messages back to their creators to do that work.</p>
  </blockquote>
  
  <p>But I would like to leave the DOM as-is; I simply want to draw things on a canvas element. Is this possible, or are Web Workers really only allowed to calculate and not to draw?</p>
  
  <p>(Or is it perhaps possible to use functions like <code>drawImage</code> to manipulate a <code>CanvasPixelArray</code> instead of drawing on a canvas?)</p>