"原生图片懒加载：loading=lazy 与解码策略"

概述浏览器原生支持 `<img loading="lazy">` 延迟加载屏外图片，并可通过 `decoding` 控制解码策略。与 `fetchpriority`、正确的尺寸占位与格式选择协作，可改善 LCP/CLS 与总体带宽。示例<img src="/img/hero.jpg" width="1200" height="800" decoding="async" fetchpriority="high" alt="首屏图"> <img src="/img/gallery-1.jpg" loading="lazy" width="600" height="400" decoding="auto" alt="画廊图1"> 工程建议占位与稳定：为图片设置 `width/height` 或 CSS 占位，避免布局抖动（CLS）。选择性懒载：首屏关键图不使用 lazy，搭配 `fetchpriority="high"`；非关键图使用 lazy。解码策略：大图使用 `decoding="async"` 避免长时间阻塞；对兼容问题保留 `auto`。参考与验证MDN `<img>` 属性文档：https://developer.mozilla.org/docs/Web/HTML/Element/imgweb.dev 原生懒加载指南：https://web.dev/articles/native-lazy-loadingChrome 平台文档（Fetch Priority）：https://developer.chrome.com/docs/web-platform/fetch-priority/