画布动画的requestAnimFrame或setInterval？

Question

哪个是帆布动画最好的？requestAnimFrame还是setInterval？

Answer 1

requestAnimationFrame保证您的动画在浏览器准备好绘制新帧时完全运行.如果您使用setInterval,则存在以下风险:

• 使间隔时间过短,在这种情况下,您将耗尽电池寿命,执行过于频繁的绘制操作,永远不会显示
• 使间隔时间过长,在这种情况下,您可以通过使用较短的间隔获得更平滑的动画

requestAnimationFrame当页面不可见时(这可以节省电池寿命)可以减少运行频率,但是一些实现也setInterval可以这样做(目前在Firefox和Chrome中).

requestAnimationFrame是从头开始构建的,旨在用于动画; setInterval旨在做任何需要定期行动的事情.如果你正在做动画(特别是画布动画),我会建议使用旧版浏览器requestAnimationFrame的后备setInterval.