什么是 requestAnimationFrame？
💡
原文英文，约300词，阅读约需1分钟。
📝
内容提要
`requestAnimationFrame` 是 JavaScript 方法，用于与屏幕刷新率同步动画。它在重绘前调用函数，确保流畅并减少跳帧。相比 `setInterval` 的固定速率，`requestAnimationFrame` 更节省资源。适合复杂动画，而 CSS 动画适合简单动画。
🎯
关键要点
-
requestAnimationFrame 是用于创建与屏幕刷新率同步的动画的 JavaScript 方法。
-
它在下次重绘前调用指定的函数，确保流畅的性能并减少跳帧的风险。
-
requestAnimationFrame 根据设备性能自动调整帧率，无需手动控制。
-
当标签页不可见时，requestAnimationFrame 会自动暂停，节省资源并防止不必要的动画。
-
与 setInterval 相比，requestAnimationFrame 不会在浏览器准备好渲染下一个帧时执行，可能导致跳帧。
-
setInterval 以固定速率运行，不适应用户设备的性能。
-
setInterval 无论标签页是否可见都继续运行，浪费 CPU 资源并可能导致性能问题。
-
requestAnimationFrame 需要为每一帧编写 JavaScript，而 CSS 动画通过定义 CSS 属性自动运行，无需管理帧更新。
-
requestAnimationFrame 可以自动调整帧率，并在标签页不可见时暂停，而 CSS 动画在标签页不可见时可能无法有效暂停。
-
requestAnimationFrame 适合复杂动画，而 CSS 动画更适合简单的声明式动画，如淡入、缩放、旋转和移动元素。
🏷️
标签
➡️
