三.js ObjLoader 内存增加

Posted

技术标签:

【中文标题】三.js ObjLoader 内存增加【英文标题】:three.js ObjLoader Memory Increasing 【发布时间】:2014-02-16 19:38:23 【问题描述】:

我正在使用 OBJLoader.js。我有一个按钮,点击时会从场景中删除一个 3d 模型并添加一个新模型,但每次加载模型时,chrome 中的内存使用量都会增加约 50 MB,并且不会减少。我试过“dispose()”和null,但用处不大。有一个动画函数每秒被调用一次,它使用渲染器渲染场景。

function freeMemory(model) 
if (model instanceof THREE.Mesh) 
    var texMat = model.material;
    texMat.map.dispose();
    texMat.map = null;
    texMat.dispose();
    texMat = null;
    model.geometry.dispose();
    model.geometry = null;
    model = null;
 


function loadModel() 
scene.remove(model);
freeMemory(model);
var loader = new THREE.OBJLoader();
loader.load('test3d.obj', function(object) 
    object.children[0].geometry.computeFaceNormals();
    geometry = object.children[0].geometry;
    console.log(geometry);
    geometry.dynamic = true;
    var modelTexture = THREE.ImageUtils.loadTexture("models/tex_0.jpg");
    object.traverse(function(child) 
        if (child instanceof THREE.Mesh) 
            child.material.map = modelTexture;
            model = child;
            model.scale.set(0.5, 0.5, 0.5);
            model.translateOnAxis(new THREE.Vector3(1, 0, 1).normalize(),
                    1.5);
            model.rotation.x = 0;
            model.rotation.y = 0;
            model.rotation.z = 0;
            modelInitialPositionX = model.position.x;
            modelInitialPositionY = model.position.y;
            modelInitialPositionZ = model.position.z;
            scene.add(model);
        
    );
    modelTexture.dispose();
    modelTexture = null;
);
loader = null;

我有任何最佳实践可用于在单击按钮时添加和删除 .obj 和纹理。

【问题讨论】:

***.com/a/33199591/1980846 【参考方案1】:

尝试停止动画,代码如下:

animate()
    this.requestId = requestAnimationFrame(this.animate.bind(this));
    this.render();

render()
    this.renderer.render(this.scene, this.camera);

stop()
    window.cancelAnimationFrame(this.requestId);

【讨论】:

【参考方案2】:

如果在将 Object3D 添加到场景之前将其存储在 var 中,则无需删除/处置它并实例化新对象,只需修改它即可,也许这不会导致内存泄漏。

尝试类似:

var model = new THREE.Mesh( firstGeometry, firstMaterial);
scene.add( model );

然后,当你需要替换它时,你只需修改它:

model.geometry = newGeometry;
model.material = newMaterial;

无需再次将其添加到您的场景中。

如果你摆弄它,我可以编辑你的 loadModel 函数。

【讨论】:

每次必须加载模型时都实例化一个新的 OBJLoader 可能会导致另一个内存泄漏。这没有任何意义,因为如果你需要加载多个模型,你只需实例化一个加载器,每次需要时使用它【参考方案3】:

一种解决方法是尝试限制帧速率。 我发现它可以将内存使用量降到最低。 我的草图会一直使用增量内存,直到电脑开始挂起,有时 gpu 使用率约为 80%。

Limiting framerate in Three.js to increase performance, requestAnimationFrame?

【讨论】:

降低帧率不会影响加载到模型中使用的内存。 限制帧率后检查统计面板。

以上是关于三.js ObjLoader 内存增加的主要内容,如果未能解决你的问题,请参考以下文章

three.js OBJLoader 未在反应中加载

如何在three.js中使用mtlLoader和objLoader中的多个纹理?

OBJ Loader 不会“创建”或“渲染”对象

三.js JSONLoader 回调

如何在 TypeScript 中使用 three.js 加载 OBJ 模型

THREE.OBJLoader投下了阴影?