延迟加载 (Lazy Loading) 是一种将网页资源 (图片、视频、iframe 等) 的加载推迟到即将显示在用户屏幕上时才执行的优化技术。页面初始加载时仅获取必要的资源，随着用户滚动逐步加载其余内容，从而大幅提升首屏加载速度。
HTML 的 img 元素只需添加 loading="lazy" 属性，即可启用浏览器原生的延迟加载功能。Chrome、Firefox、Safari、Edge 等主流浏览器均已支持该属性。无需 JavaScript 库即可实现，引入成本极低。
延迟加载对 Core Web Vitals 的影响显著，尤其直接改善 LCP (Largest Contentful Paint)。如果页面包含 50 张图片，不使用延迟加载时会同时下载所有图片；使用延迟加载后仅先加载屏幕可见的几张。据 HTTP Archive 数据，引入延迟加载可使页面大小中位数减少约 20%。
在短链接的重定向目标页面实施延迟加载，直接关系到用户体验的提升。点击活动链接的用户期望立即看到内容，首屏加载过慢会导致跳出率上升。据 Google 调查，页面加载时间从 1 秒增加到 3 秒时，跳出率会增加 32%。
延迟加载的注意事项：首屏 (无需滚动即可看到的区域) 的图片不应设置 loading="lazy"。对首屏图片使用延迟加载反而会恶化 LCP，产生反效果。相关书籍可在 Amazon 上查阅。