Visio に似た「ボックスと矢印」の図を表示するアプリケーションに取り組んでいます。一部の要素はドラッグ アンド ドロップ可能です。主な機能は、不透明度、角度のある接続線、およびいくつかのアニメーション化されたトランジションです。
ターゲット プラットフォームは、Webkit ブラウザー、iOS タブレット、および Android タブレットです。
(私はこの質問を見ましたが、私が見たリンクでは、2 つのCanvas と SVG アニメーション (効果[フィルター] とパフォーマンス)の高レベルのパフォーマンス比較は示されていません)
この種のレンダリングと操作で最高のパフォーマンスを発揮する Web テクノロジはどれですか? キャンバス描画、SVG、または div/Dom 操作?
キャンバス: すべてを完全に制御できます。シェイプやテキスト、その他のウィジェットを自分で定義できます。ピクセルレベルのコントロールがあります。
SVG : 多数の形状と効果を使用できます。SVG は XML です。個人的な偏見を許してください。私は XML が最も気に入っています。
DOM : ブラウザー間の互換性の問題と戦わなければならないため、おそらく最も使いにくいですが、CSS やアニメーション、または JavaScript を使用したその他のロジックで効果を簡単に表現できるというトレードオフがあります。
パフォーマンス？よくわかりません。ターゲット プラットフォームの範囲は非常に広いです。少しの経験的またはベンチマークテストを行う必要があります。
キャンバスのスタックや画面外での描画などの一般的なショートカットを使用すると、おそらくキャンバスが最速のパフォーマンスを発揮します。
もちろん、すべて私の意見です。