私は現在、three.js と 3D グラフィックスを初めて学んでおり、ボクセル エンジン (Minecraft、Infiniminer を考えてください) を作成しようとしています。スクリプトが大量のメモリを消費していることに気付きましたが、その理由について疑問があります。ブロックの一部が同じに見える場合でも、作成するすべてのブロックが新しいメッシュ オブジェクトを使用します。
これを行うためのよりメモリ効率の良い方法を知っているかどうか、私が知っている何人かの人々に尋ねました. 、しかしそれほどthree.jsではありません）。three.js はこのようなことを可能にしますか? もしそうなら、どのようにそうしますか? そうでない場合、他の代替手段はありますか?
(これまでのところ、レンダリングするすべてのアイテムがシーン グラフにある必要があることを理解しているため、複数のブロックが同じように見えても、ブロックの複数のコピー (異なる x、y、z 座標) をグラフ。私はおそらく間違っています。)
明確にするために、こんにちは。Three.js は、拡張機能のない OpenGL ES 2.0 のサブセットである WebGL API のラッパーです。したがって、OpenGL 関連の知識はここである程度当てはまります。必要なのは、Three.js ソースを介して高から低まで作業することだけです。
さて、オブジェクトの基本セットを用意してから、それらを複製して再配置するというアイデアは適切です。関数がありclone()ます。基本的に、これはあたかも新しいメッシュを作成しているかのようにまったく新しいオブジェクトを作成しますが、実行時にもう少しアクセスしやすくなります。
アドバイスを差し上げたいと思いますが、いくつかのコードを確認することで、お客様のユース ケースに対するより正確な最適化を判断するのに役立つ可能性があります。おそらく、初期化フェーズにプッシュできる/プッシュする必要がある呼び出しがいくつかあります。メモリが他の場所でリークしている可能性がありますか? または、コードまたは 3D モデリング プログラムのいずれかで、ジオメトリが静的なままである場合は、ジオメトリの一部をマージすることを検討できます。これにより、ポリカウントが大幅に減少することはありませんが、シーンを簡素化するのに役立ちます。
three.js トラックボール コントロールであなたが求めていることを達成していると思います。 こちらのリンクをご覧ください
ソースの表示に問題がある場合は、キーボード ショートカット cntrl + u (Windows) を使用してください。