問題タブ [konvajs]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 多くの画像に対する Konva.js の最適化
私は現在、Konva.js を使用して、いくつかのスタックされた FastLayers に多くの PNG 画像を並べています。PNG には不透明度が含まれており、ドラッグやヒットボックスは必要ありません。タイルは頻繁に交換されますが、これは 30x30 程度の中規模のグリッドに適しているようです。タイルが約 100x100 または 60x60 にまで成長し始めると、個々のタイルを置き換えるときにパフォーマンスが低下し始めます。
タイルを「チャンク化」する作業、つまりタイルを小さな FastLayer グループに追加する作業を開始しました。たとえば、単一の 100x100 FastLayer は複数の 10x10 FastLayer に分割されます。1 つのタイルが変更されると、そのチャンクのみが再レンダリングされ、理想的には全体のレンダリング時間が短縮されるという考え方です。
これは試すのに適した設計ですか、それとも別のアプローチを試す必要がありますか? Konva.js のドキュメントでパフォーマンスに関するヒントを確認しましたが、このケースに直接関連するものは見当たりませんでした。