javascript - requestAnimationFrame如何控制帧速？

问题描述

想在canvas里实现动画，动画是每帧都画在Sprite上连成一张图的，试过用setTimeout实现动画，发现会跳帧，但是requestAnimationFrame无法控制帧速，我希望1s画7帧该怎么办？

问题解答

requestAnimationFrame就是在浏览器下一帧渲染时调用的，所以可以认为requestAnimationFrame的调用速率就是浏览器的刷新速率，一般来说是60帧

但是requestAnimationFrame调用callback的时候会传入一个时间戳参数，可以根据这个参数来进行判断从而处理你实际需要的帧速

比如要1秒7帧的话可以这样写

let step = (timestamp, elapsed) => { if (elapsed > 1000 / 7) {//TO DO SOMETHINGelapsed = 0 }window.requestAnimationFrame(_timestamp => step(_timestamp, elapsed + _timestamp - timestamp) )}window.requestAnimationFrame(timestamp => step(timestamp, 0))回答2：

貌似不可控，浏览器自己计算的

1s7帧这种刷新速率...本来就是'跳帧'的效果...