I was playing around with different drawing methods on canvas to see which would be the fastest. The tests were drawImage with an image object, drawImage with a temporary canvas object containing nothing but that image already drawn and putImageData which is obtained by using getImageData on the previous temporary canvas.

In Chrome putImageData is slightly faster and little difference between drawing an image or canvas.

However in Firefox we see speeds comparable to Chrome when using putImageData! A very big difference. Even drawing canvas over an image is faster.

It looks like Crafty will be using this method for the next version but there is one problem. There are security constraints which means running the code as a local file will throw an error. Therefore you need a web server even if it is just JavaScript. There are settings in most browsers to turn the errors off but still a bit of a pain.

What I could do is try { getImageData } else use drawImage with the temporary canvas. It will be inconsistent but a minor compromise.