A型架相机VS上场景three.js所相机peformance与大量元件

Question

的下面的代码笔压力测试3种方案：https://codepen.io/ubermario/pen/QqWQPa

... 
    this.el.setObject3D(objName, cubeObj); //register to A-Frame; accessible with this.el.getObject3D(objName) 
... 

1. 使用上的场景通过多达60000立方体滚动WASD控制的默认相机。使用.setObject3D方法生成多维数据集，该方法将动态生成的元素注册到A-Frame。
2. 使用带WASD控件的默认摄像头在场景中滚动多达60,000个立方体。使用three.js object3D.add方法生成多维数据集，该方法不会将动态生成的元素注册到A-Frame。
3. 使用three.js轨道控制摄像头在场景中滚动多达60,000个立方体。使用three.js object3D.add方法生成多维数据集。此场景与场景＃2类似。

问题：尽管所有3种方案的加载速度非常快。场景＃3在滚动时总是表现良好。场景＃1和＃2有时会出现“锯齿状”图像刷新。

任何有关使用场景＃1实现场景＃3性能的建议？

Answer 1

您所看到的是在示例＃3中，OrbitControls管理render()循环。因此，它只会决定在滚轮实际移动时进行渲染，并且可以保持平滑。您可以在渲染功能中添加console.log('render')，并查看它只在滚动时打印。

该策略对VR无帮助，无论如何，因为HMD总是在移动，所以您需要以90 FPS重新渲染。所以不幸的是，在A-Frame中没有办法做同样的事情。

如果渲染很多类似对象是目标，你可以做什么，将减少绘制调用instancing或merging geometry。