npm 等登錄檔 改變了 JavaScript 世界的進步，他們可以： 下載及使用超過一半的公開套件。但我們通常會將 我們沒有充分使用的程式庫如要修正這個問題，請分析郵件組合 偵測未使用的程式碼，然後移除未使用的和不必要的程式庫。
對 Core Web Vitals 的影響
只要移除未使用的程式碼，就能改善網站的 Core Web Vitals：Largest Contentful Paint、 例如，當素材資源過大時，未使用的程式碼可能會受到影響 彼此競爭。如果大型語言模型 僅在用戶端轉譯標記的 JavaScript 素材資源 包含 LCP 候選人的參考資料 延後這些資源的載入時間。
未使用的程式碼也可能會影響與下一個繪製動作的互動 (INP)， 因為即使是未使用的 JavaScript 也需要下載、剖析、編譯，然後 執行狀態未使用的程式碼可能會導致資源負載出現不必要的延遲 造成網頁效能不佳的時間、記憶體用量和主要執行緒活動 回應。
本指南說明如何分析專案的程式碼集，找出未使用的程式碼。 提供了策略，方便您從運送的 JavaScript 資產中移除未使用的程式碼 實際工作環境的使用者
分析套件
開發人員工具可顯示所有網路要求的大小：
- 按下 Control+Shift+J 鍵 (或在 Mac 上為 Command+Option+J 鍵) 開啟開發人員工具。
- 按一下 [網路] 分頁標籤。
- 勾選「停用快取」核取方塊。
- 重新載入網頁。
開發人員工具也會指出應用程式中未使用的 CSS 和 JS 程式碼數量。
透過節點 CLI 指定完整的 Lighthouse 設定， 減少未使用的 JavaScript 稽核，以便追蹤有多少未使用的程式碼已出貨 資訊、
如果您使用 webpack 做為套裝工具， Webpack 分析工具 可幫助你調查套件的組成元素在您的 webpack 設定檔案與任何其他外掛程式一樣：
module.exports = {
//...
plugins: [
//...
new BundleAnalyzerPlugin()
]
}
雖然 webpack 通常是用於建構單頁應用程式， 例如 Parcel 和 綜覽也提供視覺化工具 能夠用來分析套裝組合
重新載入應用程式並加入這個外掛程式後，畫面會顯示可縮放的樹狀圖 整個套裝組合
這張圖表呈現了組合中哪些部分大於 您也能更瞭解程式庫數量和大小 應用程式匯入作業這有助於確認您是否使用任何未使用的 或不必要的程式庫
移除未使用的程式庫
在先前的樹狀圖影像中，單一內含好幾個套件
@firebase 網域。如果網站只需要 Firebase 資料庫元件，
更新匯入作業以擷取該程式庫：
import firebase from 'firebase';
import firebase from 'firebase/app';
import 'firebase/database';
針對看起來很神秘的包裹，但實際上並未使用 您可以先返回查看哪些頂層依附元件 利用 Vertex AI Workbench 使用者請設法只匯入您需要的元件。 如果您未使用程式庫，請將其移除。如果 建議考慮延遲載入 基礎架構
如果您是使用 webpack，請參閱這份清單中會自動顯示的外掛程式清單 移除熱門程式庫中未使用的程式碼。
移除不必要的程式庫
並非所有程式庫都可細分為多個部分，並視需要匯入。 在這種情況下，請評估是否可以完全移除程式庫。 一定要建構自訂解決方案或採用較輕巧的替代方案 值得思考的選項然而，您必須衡量模型的複雜性 執行這兩項策略所需的步驟後，在移除程式庫前 完全不必使用應用程式