我正在创建一个GeometryThree.js 并用顶点填充它以构建 2D 地形。创建地形后，我将所有Vector3s 和Face3s推送到几何体，然后修改每个顶点和每一帧的面。
因为我每帧都在修改人脸顶点，所以我需要告诉three.js来更新人脸。我正在使用geometry.elementsNeedUpdate = true. 此作品，但我已经注意到它会导致相当大的数量的内存使用情况（我的应用程序使用一个额外的〜50MB RAM每秒）。
以下代码演示了我正在尝试做的事情：
function pushEverything(geom) {
for (var i = 0; i < 10000; i++) {
geom.vertices.push(new THREE.Vector3(...));
geom.faces.push(new THREE.Face3(...));
geom.faces.push(new THREE.Face3(...));
}
}
function rebuild(geom) {
for (var face of geom.faces) {
face.a = ...
face.b = ...
face.c = ...
}
geom.elementsNeedUpdate = true
}
var renderer = new THREE.WebGLRenderer({
canvas: document.getElementById("my-canvas")
});
var geom = new THREE.Geometry();
var camera = new THREE.PerspectiveCamera(...);
pushEverything(geom);
while (true) {
// Perform some terrain modifications
rebuild(geom);
renderer.render(geom, camera);
sleep(1000 / 30);
}
我已经遵循了这个问题的建议，它建议使用geometry.vertices[x].copy(...)而不是geometry.vertices[x] = new Vector3(...).
我的问题是：为什么我的内存使用率在使用时如此之高geometry.elementsNeedUpdate = true？是否有更新 aGeometry的面孔的替代方法？
我正在使用来自 NPM 的three.js 0.87.1。
我已经找到并解决了这个问题。这不是three.js的内存泄漏，而是我的内存泄漏。
我正在创建一个Geometry并允许自己克隆它，对克隆执行修改，然后将其合并回原始文件。我没有意识到我应该geometry.dispose()在完成后调用克隆的几何体。所以，我基本上是在每一帧克隆几何体，这解释了巨大的内存使用量。
我已经通过将 转换Geometry为 a解决了我的问题BufferGeometry，并geometry.dispose()在完成后调用几何图形。我现在有预期的内存使用情况。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句