rAF 平滑动画

requestAnimationFrame（简称 rAF）是浏览器提供的一个用于实现高性能动画的 API。它能让 JavaScript 在下一次浏览器重绘之前调用指定的回调函数，从而实现更流畅、更节能的动画效果。

特性	requestAnimationFrame	setTimeout / setInterval
与屏幕刷新率同步	是（60fps → ~16.6ms，120fps → ~8.3ms）	手动指定时间，不一定同步
页面后台或不可见时自动暂停	是（节省 CPU 和电量）	不会暂停，继续执行
浏览器可以优化合并绘制	是（和样式计算、布局、重绘一起批量处理）	可能导致布局抖动
时间戳精度高	传入 performance.now() 级别的时间戳	Date.now() 精度较低
动画更流畅度	极高，几乎无卡顿	容易掉帧、抖动

let lastKnownScrollX = 0, tickedScrollX = 0, ticking = false

targetElement.addEventListener('scroll', function () {
    lastKnownScrollX = targetElement.scrollLeft

    if (!ticking && tickedScrollX != lastKnownScrollX) {
        requestAnimationFrame(function (timestamp) {
            // do something here

            tickedScrollX = lastKnownScrollX
            ticking = false
        })

        ticking = true
    }
})