複雑なSVGファイルのロード/レンダリング時間を改善するために、THREE.GroupをJSONにエクスポートできますか？

Question

私は現在、josdirkson's SVG押し出しスクリプトを使用して、20〜30の複雑な形状のグループを形成しています。私の目標は、個々のオブジェクトだけでなくグループ全体をユーザーの相互作用を通じて個別に操作することです。私はこれまでこれを達成することができましたが、ロード時間はさまざまなデバイスで7秒から20秒の範囲です。私は、SVGのすべてのパスをbezierCurvesなどに変換するスクリプトにこの固有のことがたくさんあるかどうか疑問に思っていました。この場合、実行可能なソリューションがThree.jsからJSONに何らかの形でエクスポートされるかどうかは疑問でしたまたはユーザがロードしている後続のデータソースとなる他のファイルタイプである。私は簡潔にat this threadを見ていましたが、群​​衆が解決策を調達する前に自分自身を先取りすることを望んでいませんでした！どんなアドバイスや入力も大歓迎です！ありがとうございました！

Answer 1

私があなたに与えることができる最高のアドバイスは、ローディングプロセスのプロファイルを見ることです。これをクロムでテストするには、解析する領域のコードにconsole.profile('something');とconsole.profileEnd('something');の呼び出しを追加します。その後、devtoolsでプロファイルパネルを開き、ページをリロードして、またはjavascriptを再実行します。

これはおそらく、あなたが前提条件について正しいかどうかを伝えることができます。少なくともJSが費やしている時間を見つけるのに役立ちます。

実際にそうであれば、ジオメトリのキャッシュを行うことができます。geometry.toJSON()とnew THREE.JSONLoader().parse(json)を使用してジオメトリを保存および復元します。ほとんどの場合、これは何らかの形でジオメトリを計算するよりもはるかに高速でなければなりません。 （注：キャッシングを行うには、他にも空間効率の良い、さらにパフォーマンスの良い方法がありますが、json形式は始めるのに適しています）