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

【问题标题】：Only geometry.elementsNeedUpdate results in memory allocation - why?只有 geometry.elementsNeedUpdate 会导致内存分配 - 为什么？
【发布时间】：2017-03-30 18:54:56
【问题描述】：

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

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/ 获得

【问题讨论】：

标签： javascript memory three.js

【解决方案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 对象，就像你目前正在做的那样。

three.js r.84

【讨论】：