JS 中,window 对象的 requestAnimationFrame 是什么?

window 提供一个 API,优化动画的执行。

语法:

const id = window.requestAnimationFrame(callback);

传入一个回调函数 callback,在下一次重绘的时候执行。

浏览器重绘频率一般是60 fps(frame per second),也就是一秒钟执行60帧动画。

它的优点有:

  1. 执行流畅。requestAnimationFrame 执行时间和重绘频率一致,相当于自带函数节流功能。
  2. 执行准确。浏览器重绘频率定好的,不会像 setTimeout 需要主流程执行完毕再执行。
  3. 性能优化。在页面 hidden 的情况下,requestAnimationFrame 不会执行,节省性能。

取消 requestAnimationFrame

window.cancelAnimationFrame(id)

我是 Pandy,一个喜欢英语的程序猿 👨‍💻

关注公众号 Yopth,回复「加群」,加入「英文技术翻译互助群」,我们加入一起充电英语 🔌

Reference

[1] https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame
[2] https://blog.csdn.net/xuanhun521/article/details/112793135

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值