我把这个代码笔做成了一个网站。我的问题是，它在我的Nexus 5X手机的Chrome浏览器上运行得很慢，但当我将屏幕旋转到水平视图或查看CodePen时，它再次平稳运行。
我试着颠倒宽度和高度，看看这是否是屏幕/窗口高度的问题，我也试着把高度降低了很多，但仍然是一样的。
请在webgl或webgl方面更有经验的人向我解释一下这一点吗？
function init() {
scene = new THREE.Scene();
height = window.innerHeight;
width = window.innerWidth;
aspectRatio = width / height;
// ...
}
您可能需要在渲染循环中包含一些调整大小的逻辑，因为加载后(即旋转时(初始窗口大小可能会发生变化。。如果窗口大小发生变化，但渲染器没有调整大小，则渲染器将渲染到非直观的帧缓冲区大小，并且在尝试将输出缩放到实际显示时可能会导致问题。
编辑：
我只是猜测而已D你的观点很好。。。
我确实看到了你的索引js的TODO第36行，这可能会引起问题。。除此之外，里面的一切对我来说都是合法的。
调整大小的逻辑可能很棘手，因为根据CSS等设置渲染器大小，可能会导致病态的级联调整大小，因为设置渲染器的大小会改变相机的大小，这可能会导致布局变化。。在一些奇怪的情况下，可能会导致小规模的调整不断发生。
另一种检查问题是否存在的方法是，只需在init中使渲染器成为一个固定大小的正方形。。。比如256x256之类的。。并在窗口外注释。resize侦听器。在你的手机上运行它，看看在旋转时性能是否保持一致。。。fwiw，我想我在我的Galaxy S5上看到了这个问题……在水平模式下，它是超级液体，但在垂直模式下。。看起来有点狡猾。
嘿，你在代码中使用PMREMGenerator了吗？我注意到，在人像模式下，使用它生成环境地图在手机上真的很流行