THREE.js在不使用时暂停动画

问题描述 投票:0回答:1

我正在用React构建我的THREE.js应用程序,我有两个组件,一个用THREE.js制作的轮播场景和一个全屏覆盖场景。显示叠加层时,我想暂停旋转木马场景,因为它根本不可见。

目前,我只是用window.cancelAnimationFrame取消动画框架,但我注意到网上的几个片段,人们往往只是设置一个像stoptrue的变量,然后在update循环内,它会是这样的:

update() {
  if (this.stop)
  this.renderer.render(this.scene, this.camera);
  this.frameId = window.requestAnimationFrame(this.update);
}

我想知道其中一个是否有比另一个更好的表现?就像取消和重新启动动画帧一样,比仅仅保持动画循环更昂贵。

javascript three.js requestanimationframe
1个回答
0
投票

显然,使用cancelAnimationFrame会有更好的性能,因为你的处理器不必执行该功能并每秒检查this.stop 60次。然而,现代处理器是如此强大,运行一个简单的if()声明是微不足道的,你的性能差异将是微不足道的。

这两个选项都可以解决您的问题,因此给出答案更多的是意见问题,这超出了Stack Overflow的范围。

© www.soinside.com 2019 - 2024. All rights reserved.