别再用 setTimeout 猜时间了:IntersectionObserver 实现图片懒加载的完整实践
做商品列表页或者信息流的时候,图片懒加载几乎是绕不开的需求。早几年大家习惯监听 scroll 事件,配合 getBoundingClientRect 手动计算元素是否进入视口,再写个节流函数控制触发频率。这套方案能跑,但坑不少:滚动过程中频繁触发布局计算,主线程压力大;快速滚动时容易漏掉元素;还要处理不同浏览器的兼容差异。后来不少团队换成 IntersectionObserver,它把“元素何时进入视口”这件事交给浏览器自己的渲染管线去判断,回调里直接告诉你目标元素和视口的交叉状态,省掉了手动算位置这一步。这篇文章从实际开发角度出发,讲清楚 IntersectionObserver 的核心 A...