实现原理与准备工作

同时，可用低分辨率模糊图或纯色背景作为占位符，🎊待真实图片加载完后替换，这样既保持了页面结构稳定，又提升了视觉过⭐渡的自然度

常见问题与解决方法

建议将阈值设置在视口边缘外 10🎵0至300像素 处，这样图片在即将进🌟入屏幕时就开始加载，用户几乎感受不到等待

对于使用Intersection Observer的场景，确保在HTML中仍保留 src 属性（可以是占位图），并将真实地址存放▶️在 data-src 中，这样爬虫仍能读取到一张有效图片

性能优化的进阶建议

其核心原理是：仅当图片即将进入浏览器可视区域（视口）时，才真正加载图片资源，从而减少初始请求数量，降低服务器压力，同时让首屏内容更快呈现给用户