Javascript 使用requestAnimationFrame替换$（window）.on（'；scroll'；，function（）{}）是否安全；？

当用户滚动时，我需要每隔±100ms知道当前滚动位置。该位置决定页面的哪一部分被“照亮”

使用

$（窗口）.on（'scroll'，function（）{}）一切正常。我使用u.debounce来消除事件的影响，并在文档现在所在的位置每隔100毫秒签入一次

但是-在iPad上-直到滚动完全停止后才会触发“滚动”，这在我的场景中非常糟糕，因此我正在尝试找到更好的解决方案

起初，我想使用
setInterval
并以这种方式每隔100毫秒检查一次位置，但我了解到它在移动设备上效率不高，即使选项卡没有打开，它也会运行。所以我偶然发现了requestAnimationFrame，目前看来我可以做到：

saved_pos = -1;
rAF = window.requestAnimationFrame;
set_sticky_pos = function() {
  if (saved_pos === window.scrollY) {
    rAF(set_sticky_pos);
    return false;
  }
  saved_pos = window.scrollY;

  debounced_trigger_function(saved_pos);
  rAF(set_sticky_pos);
};

然后，我的
debounced\u trigger\u函数
将检查当前位置，并根据它通过在其父元素上添加类来说明所需的内容

通过这样做，有什么我应该知道的吗？这是一个大禁忌吗

注意：你可能已经注意到，我并没有做任何真正的“动画”，而这正是（我认为）rAF的实际设计目的，但这似乎是对抗iPad慢度的唯一方法。这就是为什么我决定把这个问题贴在SO上——即使我没有“动画制作”，也可以使用rAF吗

TL；博士
使用rAF作为实时滚动位置检测的变通方法，而不是“动画”可以吗？
由于iOS设备使用webkit浏览器，您可以使用一行CSS在其上实现平滑滚动：

-webkit-overflow-scrolling: touch;

如果这对您不起作用，您可以将rAF与自定义的polyfill一起使用，和/或在rAF不可用时退回到滚动，但这很容易验证：

window.requestAnimFrame = (function(){
  return  window.requestAnimationFrame       ||
          window.webkitRequestAnimationFrame ||
          window.mozRequestAnimationFrame    ||
          function( callback ){
            // defualt scrolling logic or setInterval
            window.setTimeout(callback, 1000 / 60);
          };
})();

此外，如果您不想干扰桌面浏览器上的默认滚动，您可以使用Modernizr来检测运行代码的设备是否启用了触摸功能，并且than（和仅than）可以覆盖默认滚动行为。这很容易

if(Modernizr.touch) {
    // your custom scrolling logic here, rAF for example
}