2026-08-20
Ghost 是开箱即最快的静态站生成器之一。但如果你的文章被 5MB 的封面图和未压缩的 PNG 拖累，速度将毫无意义。本指南覆盖 Ghost 图片优化的全部要点——从格式选择到懒加载，从 WebP 转换到 CDN 配置。
Ghost 技术栈现代（Node.js、React、Tailwind），HTML 加载很快。但浏览器渲染页面前仍要下载每张图片。未优化的图片是 Ghost 博客 LCP（最大内容绘制）变慢的头号原因，而 LCP 是 Google Core Web Vitals 之一，直接影响搜索排名。
Ghost 原生支持 WebP、AVIF、JPEG、PNG 和 GIF。博客图片的优先级：
Ghost 内置的图片优化不错，但可以做得更好。推荐设置：
Ghost 默认对编辑器插入的图片启用懒加载。但自定义图片或通过 HTML 添加的图片可能需要手动设置。加上 loading 属性：
<img src="image.jpg" loading="lazy" alt="Description">
首屏图片（如封面图）请用 loading='eager' 或省略该属性——首屏懒加载反而会拖慢 LCP。
使用 Cloudflare 或 Imgix 等 CDN 提供优化后的图片。这些服务会自动按浏览器支持转换为 WebP/AVIF、按需缩放并全局缓存。Ghost 与大多数 CDN 无缝集成。
Ghost 内置基础图片优化，但不如专用图片 CDN 激进。最佳实践是 Ghost + CDN（如 Cloudflare 或 Imgix）组合。
封面/头图用 AVIF（压缩最好）；文内照片用 WebP（兼容性更好）。现代浏览器 AVIF 支持已超过 95%。