HTML5 を使用したオフスクリーン レンダリングが非常に困難です。私が書いたコードは、Firefox で完全に正常に動作します。canvas 要素で drawImage を使用すると、滑らかな画像が非常に迅速に描画されます。
ただし、Chrome 21 を使用すると、drawImage のパフォーマンスはひどいものになります。どこが間違っているのかわかりません。
これは、いくつかのサンプル コードを含む jsfiddle です: http://jsfiddle.net/DXgum/3/
Firefox では約 60 fps が得られますが、chrome では 10 fps のフレームレートしか提供されません。in-dom キャンバス要素を使用しても、not-in-dom を使用しても、パフォーマンスに違いはありません。
Chrome でのバッファリングなしでのレンダリングは Firefox よりも高速であるため、Chrome が drawImage でこのような問題を抱えている理由が実際にはわかりません。
問題への助けや光があれば大歓迎です!
システムインフォメーション:
- ウィンドウズ7 32ビット
- インテル QX9650
- NVIDIA GTS 250
- 4GB DDR2 RAM
- Chrome バージョン: 21.0.1180.60 m
- Firefox バージョン: 14.0.1