Safari 26.2 版本于 12 月发布，新增对 scrollend 事件的支持，这标志着 Web 平台迎来了一个重要里程碑。此次发布意味着这个事件现已获得 Chrome 114、Edge 114、Firefox 109 等所有主流浏览器的基线支持。此次更新填补了平台滚动事件模型中长期存在的空白，让开发者不再需要依靠不稳定的变通方案来检测滚动何时结束。
scrollend 事件会在滚动完全结束时触发一次，无论滚动是由用户手势、键盘导航、平滑滚动，还是 scrollTo() 等 JavaScript 程序化调用触发。根据 WebKit 的公告，这个事件提供了“滚动已完成的可靠信号”，解决了困扰 Web 开发者多年的问题。此前并没有原生方法可以判断滚动何时真正结束，开发者只能使用基于定时器的防抖机制来估算，通常会设置 100 毫秒或更长时间的 setTimeout() 延迟。这种方式既不精确也不可靠，容易出现事件触发过晚，或是用户手指仍在屏幕上时就提前触发等问题。
在 scrollend 之前，检测滚动完成需要这样的代码：
document.onscroll = event => { clearTimeout(window.scrollEndTimer) window.scrollEndTimer = setTimeout(callback, 100)}现在，借助原生浏览器支持，可以用简洁的方式实现相同的结果：
document.onscrollend = event => { // scrolling has definitively ended}浏览器会在内部处理所有复杂的判断逻辑，包括触摸结束、指针释放、按键操作完成、滚动吸附以及可视视口滚动等。如果滚动位置实际并未发生变化，则不会触发该事件，从而避免假触发。
开发者对 Safari 的这一实现反馈积极。X 平台上的一篇帖子指出，该功能是期待已久的补充，并梳理了其在实际应用中的诸多优势：
现在我可以在用户停止滚动时准确保存阅读进度，无需再使用不可靠的轮询逻辑……
在 Safari 尚未支持该事件之前，Stack Overflow 上的相关讨论就曾指出，需要实现跨浏览器兼容的开发者必须借助 polyfill，而 @af-utils/scrollend-polyfill 这类库恰好可以填补这一空白。
scrollend 的实际应用场景十分广泛。Chrome 开发者博客列举了常见用例，包括同步轮播滚动位置与指示点、在用户停止滚动后懒加载内容、根据最终滚动位置更新界面、用户滚动到新标签页后获取数据，以及记录分析事件。该事件对性能敏感的操作尤为重要。在滚动过程中执行计算密集型任务会影响滚动体验，而 scrollend 提供了理想的时机，可将这类任务延迟到滚动完全结束后再运行。
对于仍需支持旧版 Safari 的团队来说，实现渐进增强十分简便。开发者可以通过 onscrollend 检测浏览器支持情况，并在该事件不可用时回退到基于定时器的方案。Polyfill 则提供了另一种方式：浏览器存在原生事件时自动使用，否则回退到指针与滚动事件监听。MDN 文档提供了完整的示例和兼容性表格清单，并指出该功能目前已获得所有现代浏览器的基线支持。
scrollend 事件是一个可靠、跨平台的 API，用于检测滚动何时完成。它会在浏览器完成滚动动画、用户触摸或指针手势结束、键盘导航完成，以及通过 scrollTo() 等 API 执行程序化滚动结束时触发。该事件同时支持文档级滚动与单个可滚动元素，并能正确处理可视视口交互（如双指缩放）。对于多年来一直使用各种变通方案的 Web 开发者而言，Safari 26.2 对该事件的实现，补齐了自 2023 年 Chrome 114 开始推进的相关标准化工作的最后一块拼图。
【声明：本文由 InfoQ 翻译，未经许可禁止转载。】
查看英文原文：https://www.infoq.com/news/2026/04/safari-scrollend-support/
