requestAnimationFrame

过去js动画是用setINtervl, setTimeout,改变位置, 形状, 大小

浏览器60Hz, 每秒60次才能保证平滑,流畅, 不然就会感到跳,也就是最大17ms

传统的定时器是不够精确的, setInterval(fn,time);不能保证立即执行, 只是放在任务队列里。 Task Queue(setTimeout, setInterval, xhr) -> Microtask Queue(Promise, Mutation Observer)-> call stack[](调用栈) ->。Event loop是永远在循环执行的,查看调用栈是否空闲, 非常快。微任务队列是一次执行, 任务队列是一个个调用的

requestAnimationFrame会保证动画执行,调用了动画就会开始,只接受一个参数 在每个动画周期, 调用这个参数/回调, 常常是要递归手工调用, 会在下一帧的时候调用。 食杂重绘前调用。

返回一个Id, 可以用来取消

var id = RequestAnimationFram(e)

window.cancelAnimationFrame(id);

 

节流

 

posted on 2020-10-12 08:06  connie313  阅读(112)  评论(0编辑  收藏  举报