loading="lazy" 是HTML标准中的原生懒加载属性，由浏览器直接支持，无需JavaScript。 当图片或iframe即将进入视口（viewport）时，浏览器才开始加载它们，从而减少初始页面加载时间、节省带宽、提升性能指标（如LCP、FID）。

支持的值：lazy（延迟加载）、eager（立即加载，默认行为）、auto（浏览器自行决定）。

主流浏览器均已支持：

• Chrome 77+（2019年9月）
• Edge 79+（2020年1月）
• Firefox 75+（2020年4月）
• Safari 15.4+（2022年3月，含iOS Safari）
• Opera 64+、Samsung Internet 等Chromium内核浏览器

截至2025年，全球浏览器覆盖率超过95%。对于不支持的旧浏览器，该属性会被安全忽略（渐进增强），图片仍会正常加载。

原生懒加载的优势：

• 零依赖：不需要引入任何JS库，减少页面体积
• 更快：浏览器原生实现，无需监听滚动事件，性能开销极低
• 更智能：浏览器可根据网络状况、数据节省模式等因素自动调整加载策略
• SEO友好：搜索引擎爬虫能正确理解loading属性
• 维护简单：纯声明式，不需要写任何逻辑代码

JS懒加载库的优势：更灵活的阈值控制、占位图动画、错误重试等高级功能。但对于大多数场景，原生懒加载已足够优秀。

decoding="async" 告诉浏览器异步解码图片，不阻塞主线程渲染。与 loading="lazy" 配合使用效果更佳：

• loading="lazy" 控制何时开始加载图片资源
• decoding="async" 控制如何解码已加载的图片数据

两者结合可以显著提升页面渲染性能，减少布局偏移（CLS）。本工具支持一键同时添加这两个属性。

使用JavaScript一行代码即可检测：

'loading' in HTMLImageElement.prototype

返回 true 表示支持，false 表示不支持。也可以在iframe上检测：'loading' in HTMLIFrameElement.prototype。

正面影响：懒加载可以提升页面加载速度，而页面速度是Google排名因素之一。更快的LCP（最大内容绘制）指标有助于Core Web Vitals评分。

注意事项：确保首屏（above-the-fold）的关键图片不要设置loading="lazy"，否则可能延迟LCP的触发时机。首屏图片应使用loading="eager"或省略该属性（默认为eager）。

Googlebot在渲染页面时支持loading="lazy"，会自动处理懒加载的图片，不会影响索引。

目前HTML标准中，只有两个元素支持loading属性：

• <img> — 图片元素
• <iframe> — 内嵌框架

<video> 标签不支持loading属性。视频元素已有自己的preload属性（可选值：none、metadata、auto）来控制加载行为。对于视频懒加载，仍需使用JavaScript方案。