分享我：

Nuxt Booster

• ✨   发布说明
• 👁   预览

Nuxt Booster 负责您的生成网站的 Lighthouse 性能优化。所有使用的组件和资源都根据视口按需加载。

入门

请遵循 📖   文档

• v2: basics.github.io/nuxt-booster/v2/

要求

• NodeJS >= 19
• NuxtJS >= 3.5.0

功能

• 基于视口的页面资源（如字体、组件、图片、图像和 iframe）的动态加载
• 通过初始性能测量可选地阻止 javascript 执行
• 通过消除不必要的 javascript 文件来优化 javascript 文件的初始加载
• 防止加载当前视口之外的不必要资源（包括组件）。
• 可选信息层概念，用于在带宽或硬件受损时告知用户 UX 降低。
• 全新的字体声明方法
• 优化后的图片组件（支持基于视口的源，例如横向/纵向）
• 优化后的图像组件
• 支持 SEO 友好的懒惰水合模式（图片 + 图像）
• 优化后的 youtube/vimeo 组件（不同分辨率的自动生成的海报图像）

结果

• 根据当前视口提供最少的所需资源
• 如果您按照指定使用这些工具，您将获得 100/100 的 Lighthouse 性能得分

📖   阅读更多

浏览器支持

您可以将 nuxt-booster 与 Internet Explorer 11 浏览器一起使用。 在浏览器兼容性中了解更多

IE / Edge	Firefox	Chrome	Safari	iOS Safari	Samsung	Opera	Vivaldi
Edge	最新 2 个版本	最新 2 个版本	最新 2 个版本	最新 2 个版本	最新 2 个版本	最新 2 个版本	最新 2 个版本

开发

1. 克隆此仓库。
2. 使用 npm install 或 yarn install 安装依赖项。
3. 使用 npm run dev 或 yarn dev 启动开发服务器。

预览

1. 克隆此仓库。
2. 使用 npm install 或 yarn install 安装依赖项。
3. 使用 express 构建并启动 npm run start:generate 或 yarn start:generate。
4. 在浏览器中打开 http://127.0.0.1:3000。

或在这里查看

• 预览

咨询与支持

您是否需要进一步的支持、咨询或代码审查，并愿意支付适当的费用？请通过电子邮件联系我们：[email protected], [email protected]。我们期待您的请求。

许可证

麻省理工学院许可证