THREE.js中如何仅销毁克隆的GLTF对象而保留原对象？

首先要明确：Object3D.clone()出来的对象，只是复制了层级结构和资源引用（材质、几何体默认是浅拷贝），直接调用克隆对象的dispose()无效——因为Group或Scene本身没有可释放的GPU资源，必须递归处理所有子对象，同时先将克隆体从场景中移除。

具体操作步骤：

1. 从父节点移除克隆对象
   先确保Three.js渲染循环不再处理该对象：

   // 将克隆对象从父场景/容器中移除
   newObj.removeFromParent();
   

2. 递归遍历子节点，释放GPU资源
   GLTF导入的对象通常是嵌套的Group结构，里面的Mesh才是占用GPU内存的核心（包含Geometry和Material），需要逐个释放：

   function disposeClone(obj) {
     // 处理Mesh类型的子对象
     if (obj.isMesh) {
       // 释放几何体
       obj.geometry?.dispose();
       // 释放材质（兼容数组材质的情况）
       if (Array.isArray(obj.material)) {
         obj.material.forEach(mtl => mtl.dispose());
       } else {
         obj.material?.dispose();
       }
     }
     // 递归处理所有子节点
     obj.children.forEach(child => disposeClone(child));
   }
   
   // 调用函数清理克隆对象的资源
   disposeClone(newObj);
   

3. 清除对象引用（可选但推荐）
   帮助JS垃圾回收器彻底回收该对象：

   newObj = null;
   

关键注意事项 #

• 若克隆时使用clone(true)（深拷贝材质和几何体），克隆体的资源是独立的，按上述步骤释放不会影响原对象。
• 若使用默认浅拷贝（clone()无参数），克隆体与原对象共享材质/几何体，禁止释放这些共享资源，只需执行「移除克隆体+清除引用」即可，共享资源由原对象负责管理。

内容的提问来源于stack exchange，提问作者user16791137