javascript - 只有geometry.elementsNeedUpdate 会导致内存分配 - 为什么？

Question

如果我有一个简单的动画函数

function animate() {
geometry.elementsNeedUpdate = true;  // allocates memory without geometry.faces[ 0 ].color = ...    
requestAnimationFrame( animate );
renderer.render( scene, camera ); }

即使没有更改任何元素，我也会获得内存分配。然后我添加了面部颜色的处理。

function animate() {

geometry.elementsNeedUpdate = true;  
// geometry.colorsNeedUpdate = true; // not necessary
// material.needsUpdate = true;      // not necessary
time = clock.getElapsedTime();  
if ( time * 16 % 10 < 5 ) { 
    geometry.faces[ 0 ].color = colorBlue;      
} else {    
    geometry.faces[ 0 ].color = colorRed;       
}
requestAnimationFrame( animate );
renderer.render( scene, camera ); } 

并且它保留在内存分配中。

geometry.elementsNeedUpdate = true; 是更改面颜色所必需的。

如何避免内存分配？

完整示例可在 http://sandbox.threejs.hofk.de/memory/ 获取。

Answer 1

您想要更改对象的表面颜色。

您可以使用 copy() 或 setHex() 来执行此操作，如下所示:

mesh.geometry.faces[ 0 ].color.copy( myColor ); // or .setHex( 0xff0000 )

mesh.geometry.colorsNeedUpdate = true; // required if geometry previously rendered

不要设置其他不必要的needsUpdate标志。

不要像您当前所做的那样分配新的THREE.Color对象。

三.js r.84