javascript - Three.js 中的内存泄漏

Question

我们正在尝试创建一个单页应用程序，用户可以在其中在多个 Three.js 应用程序之间切换。但是，我们注意到选项卡的内存使用量不断增加。它们在我们的应用程序中没有内存泄漏，似乎 Three.js 变量没有从 RAM 中清除。

重新创建的步骤

1. 访问http://threejs.org/examples/并在 Google Chrome 中打开任务管理器以查看相关选项卡的内存使用情况。
2. 不断在示例之间切换，您会注意到内存使用量不断增加，并且 GC 似乎从未发生或无法取消链接以前消耗的内存块。
3. 我的笔记本电脑配置如下https://aboutmybrowser.com/pDp7aTxH当一切开始卡住时，内存很容易超过 1GB。

我注意到在 chromium 和 firefox 上有 2 个关于这个内存问题的错误，但还没有提供解决方案。

请帮助我了解如何释放内存，我在网上找到的大多数东西都没有帮助。

PS:我也在 Three.js 上提交了一个错误 https://github.com/mrdoob/three.js/issues/4276

Answer 1

这是对我有用的东西

1. 创建一个数组，用于保存添加到场景中的所有项目。
2. 每当向场景中添加一个额外的项目时，将其添加到此数组中。
3. 在销毁函数上，运行 scene.remove('item name') 将它们从场景中移除。
4. 现在遍历数组并手动将所有项目设为未定义。

通过这种方式，我能够在移动到另一个页面后释放超过 600MB 的内存。

更新Doob 先生和 WestLangley 先生的回答 Memory leak with three.js and many shapes

在 webGLRenderer 中，删除网格后

scene.remove( 网格 ),

你可以释放内存

renderer.deallocateObject( mesh );

你可以释放纹理

renderer.deallocateTexture( texture );