svg - HTML5キャンバスでのSVG画像のレンダリングのパフォーマンス

Question

SVG画像は非常に詳細なグラフィックスに最適ですが、レンダリング前に計算する必要のある多数の座標で構成されているため、たとえば、事前に計算されたピクセルの配列を描画するだけのjpgをレンダリングする場合と比較して、パフォーマンスが低下する可能性があります。 ？

Context.drawImageを使用していますが、SVGグラフィックをキャンバスの描画フレームごとに計算する必要があるのか​​、それとも何らかの方法でキャッシュされているのかわかりません。または多分私は何も心配していませんか？

Answer 1

パフォーマンスは、特定のアプリケーションとグラフィックの複雑さによって異なりますが、一般的に言えば、ベクター グラフィックは大きな影響を与えることはありません。通常、主なボトルネックは、キャンバス内のピクセル データの操作にあります。キャンバスが大きいほど、描画に時間がかかります。

ただし、フレームごとにキャンバスを再描画しない限り、最初に画像を描画したときに行われる計算のみが実行されます。変更していない場合、キャンバスは実質的に静的なビットマップにすぎません。