分享：

Nuxt Booster

• ✨   發行說明
• 👁   預覽

Nuxt Booster 接管您產生網站的 Lighthouse 效能最佳化。所有使用的元件和資源都會根據可視區域按需載入。

開始使用

請參考 📖   文件

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

需求條件

• NodeJS >= 19
• NuxtJS >= 3.5.0

功能

• 動態載入基於可視區域的頁面資源，例如字型、元件、圖片、圖像和 iframe
• 可選的透過初始效能測量來阻擋 javascript 執行
• 透過消除不必要的 javascript 檔案來最佳化 javascript 檔案的初始載入
• 防止載入目前可視區域之外的不必要資源（包括元件）。
• 可選的資訊層概念，在頻寬或硬體受損時告知使用者關於降低的使用者體驗。
• 全新的字型宣告方法
• 最佳化的圖片元件（支援基於可視區域的來源，例如橫向/縱向）
• 最佳化的圖像元件
• 支援 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。

或在這裡查看

• 預覽

諮詢與支援

您是否需要進一步的支援、諮詢或程式碼審查，並支付適當的費用？請透過電子郵件聯絡我們：stephan.gerbeth@gmail.com, lammpee@gmail.com。我們期待您的請求。

許可證

MIT 許可證