HTML5 Canvas で、drawImage と putImageData のどちらがパフォーマンスが良いか気になって調べてみた。
理由としては、imgタグからcanvasに転写するよりも、ImageData(配列で表現される画像ピクセルデータ)や別canvasを経由した方が実は早いのでは?と疑問に思ったからだ。

自分でベンチマークするまでも無く、先人がすでにjsperfで調査しているようだ。

http://jsperf.com/canvas-drawimage-vs-putimagedata/3

筆者のPCだと、drawImage(img) つまりimgタグからの転写が最速だった。
次いでputImageDataが早い。
ついでに、canvasからcanvasへの転写が最も遅かった。
20140813
うーーむ、、意外である。imgタグからの転写は何となく遅そうに思えたのだが。考えてみれば、これが最もハードウェアアクセラレーションしやすいのだろうか?
canvas からcanvas への転写はけっこう良く使うので(描画結果をいったんキャッシュするバッファー用途)早いほうが嬉しいのだが。

しかし注意しないといけないのは、特にモバイルOSにおいては、環境によって大きなバラつきがある事だ。ページ下部のグラフによれば、筆者の環境とは逆転した結果になっているものもある。
(異常に飛び出したグラフは恐らく信用できないデータだろう。)

何にせよ、drawImage() をあえて putImageData() に置き換える必要は無さそうだ。