Javascript 如何优化图纸和图纸；THREE.js中数千个立方体的交集？

我有一个3d模型查看器/编辑器，我提供给用户选择对象的部分（区域）。我在所有选定区域显示立方体，用户可以单击点并编辑它们

在编辑器中渲染超过500个立方体

这就是我所拥有的：

for(var pp in points)          {                                                       
var cube = new THREE.Mesh( new THREE.CubeGeometry( 1, 1, 1 ), new  THREE.MeshBasicMaterial({color: 0x000000}) );
        cube.position.x = model.points[points[pp]].x;
        cube.position.y = model.points[points[pp]].y;
        cube.position.z = model.points[points[pp]].z;
        cube.userData.pointCube = true;
        scene.add( cube );
}

感谢您对如何更快绘制此图的任何建议。

---

注意：我需要跟踪立方体交点。目前~~ 100个立方体都能正常工作。

在某些情况下，绘制到内存区域（在这种情况下是隐藏的画布），然后一次将该区域绘制到显示区域通常会加快速度，但我不确定它是否适用于画布，我不知道您是否可以这样做，因为画布可能封装在您正在使用的库中。您是否检查了octtree示例和octtree光线投射示例以优化拾取/交叉测试？此外，这取决于您希望对多维数据集执行的操作。您可以使用Three.BufferGeometry和BufferGeometryUtil将它们“组合”在一起，以加快绘图速度。