想要控制我的动画的FPS是继续使用setTimeout而不是requestAnimationFrame的一个很好的理由吗？

Question

我想知道我是否应该将游戏切换到requestAnimationFrame.如果还有理由再这样做了,正如我读到的那样,当你在主流浏览器中切换标签时,setTimeout()现在也会暂停.

无论如何,说我想控制动画的FPS.

目前我可以这样做:

k.state.loopinterval = 
window.setInterval(renderLoop(), 1000 / k.settings.engine.fps );

k.settings.engine.fps想要的fps 在哪里？

如果我这样做requestAnimationFrame,我就失去了这种可能性,它只会给我任何可以给予的东西:

window.requestAnimFrame(k.operations.startLoop);
renderLoop();

我看到有人建议将requestAnimFrame放在另一个循环中:

setInterval( function () {
    requestAnimationFrame( draw );
}, 1000 / 60 );

那么......我该怎么办？保持原状？

requestAnimationFrame有什么好处,现在切换标签时setTimeout也暂停了？

Answer 1

requestAnimationFrame是制作动画的正确方法.

为什么？

因为浏览器可以优化渲染以使动画更流畅.回答这个问题,另一种方法是:

window.requestAnimFrame = (function(){
    return  window.requestAnimationFrame       || 
          window.webkitRequestAnimationFrame || 
          window.mozRequestAnimationFrame    || 
          window.oRequestAnimationFrame      || 
          window.msRequestAnimationFrame     || 
          function(callback, element){
            window.setTimeout(callback, 1000 / 60);
          };
})();

下面的链接还有另一种方式.

当您调用requestAnimation时,您可以让浏览器了解何时重绘html.如果您在CSS中进行动画/过渡并移动内容或更改背景(作为精灵),则使用requestAnimation将使调用requestAnimation时渲染工作正常.没有它,浏览器将呈现任何时间的任何内容,然后可以进行更多重绘.

即使是浏览器的运行方式,它也会比我们还不知道做更多的优化.让浏览器了解我们正在做什么,然后他们帮助我们.

我发现这个链接,可以添加更多的想法