Three.jsのメモリリーク

Question

ユーザーは複数のThree.jsアプリを切り替えることができる1ページのアプリケーションを作成しようとしています。しかし、タブのメモリ使用量が常に増加していることに気付いています。私たちのアプリではメモリリークはなく、Three.js変数はRAMからクリアされていないようです。

手順は、当該タブでメモリ使用量を気づくためにGoogle Chromeで

1. 訪問http://threejs.org/examples/とオープンタスクマネージャを再作成します。
2. 例を切り替えてみると、メモリ使用量が常に増加することに気づくでしょう.GCが起こらない、または以前に消費されたメモリブロックをデリンカできないようです。
3. 私のラップトップの場合、以下の設定を使用してください。https://aboutmybrowser.com/pDp7aTxHメモリはすべてが凍結し始めると1GBを超えて簡単に撮影されます。

このメモリの問題についてクロミウムとfirefoxに2つのバグが報告されていますが、解決策がまだ提供されていません。

メモリを解放する方法を教えてください。私がインターネット上で見つけたもののほとんどは助けてくれません。

PS：ここで私はThree.jsでバグを提出しただけでなくhttps://github.com/mrdoob/three.js/issues/4276

Answer 1

は私にとって

1. トリックは、すべての項目がシーンに追加保持する配列を作成したものです。
2. シーンに余分なアイテムを追加するたびに、この配列に追加します。
3. destroy関数でscene.remove（ 'item name'）を実行してシーンから削除します。
4. これで配列全体を繰り返し、すべての項目を手動で未定義にします。

このようにして、600MB以上のメモリポストを別のページに移動することができました。

更新あなたは

renderer.deallocateObject(mesh);でメモリを解放することができます

webGLRenderer氏DoobとWestLangley Memory leak with three.js and many shapes

によって 回答、

scene.remove(mesh)でメッシュを除去した後、

あなたは

renderer.deallocateTexture(texture);