javascript - 如何停止除当前场景之外的多个场景的动画？

Question

我的程序有多个场景。当然，只有 1 个场景始终可见，那么如何停止除当前场景之外的所有其他场景的动画以提高性能？有 10 个场景，每个场景都有很多物体，对性能造成压力。

我知道可以用cancelAnimationFrame()来完成，但是如何实现呢？据说，这是最佳实践，如 recommended为了提高性能而这样做？

这 10 个场景是场景数组。当前场景是传递给 scenes[] 数组的用户输入数值。

function changeScene() {
    // Set the currentScene to the user selection
        var sceneNumber = list.options[list.selectedIndex].value;
        currentScene = scenes[sceneNumber-1];
    // Hide all scenes by default    
        for(var j=0;j<10;j++){
        scenes[j].visible = false;
    }   
}

我已经将除 currentScene 之外的所有场景编程为默认隐藏。但在研究如何在我的案例中使用 cancelAnimationFrame() 时，我没有发现任何帮助。另外，还有一个后续问题:使用 cancelAnimationFrame() 只会在页面加载所有场景和所有对象后才激活吗？或者它对加载时间也有帮助吗？

我的FIDDLE与上述及相关代码。

Answer 1

动画是数值参数随时间的变化。在您的示例中，这意味着更改 animate() 方法内的 spinningRig 旋转 Angular 。只要您仅更改当前场景的旋转(您实际上这样做了)，其他场景就不会被动画化。

如果您可能正在处理渲染而不是动画，则无需担心，因为 Three.JS 仅渲染您在 renderer.render() 中指定的一个场景。

或者您还在讨论其他问题吗？动画显然在这里不是问题。