SuperAPI AI 工具集

perf-astro

通用与其它

查看项目

更新于 10-15 22:10

技能介绍

用途:针对 Astro 项目做性能优化,帮助达到 95+ 的 Lighthouse 分数,覆盖关键 CSS 内联、构建压缩、字体加载和 LCP 优化。

主要能力:通过 astro-critters 自动提取并内联首屏关键 CSS,其余 CSS 延迟加载;通过 @playform/compress 压缩最终构建产物中的 HTML、CSS 和 JavaScript。布局层面提供字体与脚本优化模式:用 @font-face 的 font-display: swap 防止 FOIT,Google Fonts 采用 media="print" 加 onload 切换的非阻塞加载并配 noscript 回退,LCP 图片用 preload 加 fetchpriority="high" 预加载,第三方脚本延迟到用户交互或超时后再加载。

使用方式:安装依赖 npm install astro-critters @playform/compress,在 astro.config.mjs 的 integrations 中加入 critters() 与 compress({CSS: true, HTML: true, JavaScript: true, Image: false, SVG: false})。构建输出会显示内联的 CSS 体积。测量用 npx lighthouse https://your-site.com --preset=perf --form-factor=mobile。

适用场景:使用 Astro 构建、需要提升移动端性能与 Core Web Vitals 的站点。

限制:资料未提供具体版本要求、兼容性范围、收费信息或实测效果数据;Image 与 SVG 压缩默认关闭,需自行确认是否已有外部优化方案。