壓縮 JavaScript
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
壓縮 JavaScript 檔案能減少酬載大小,並縮短剖析指令碼的時間。Lighthouse 報告的「Opportunity」部分會列出所有未經認可的 JavaScript 檔案,以及壓縮這些檔案後可能節省的 KB 數:
如何壓縮 JavaScript 檔案
壓縮是指移除空白字元和任何程式碼,以建立較小但完全有效的程式碼檔案。Terser 是常用的 JavaScript 壓縮工具。Webpack v4 預設提供這個程式庫的外掛程式,可用來建立壓縮建構檔案。
堆疊專屬指南
Drupal
確認您已在「Administration」 >「Configuration」 >「Development」頁面啟用「Aggregate JavaScript files」。
您也可以透過其他模組設定更進階的匯總選項,透過串連、壓縮及壓縮 JavaScript 資產來提升網站速度。
Joomla
有些 Joomla 擴充功能可以透過串連、壓縮及壓縮指令碼來提升網站速度。此外,有些範本也提供這項功能。
Magento
請使用 Terser 壓縮靜態內容部署作業中的所有 JavaScript 資產,並停用內建的壓縮功能。
回應
如果您的建構系統會自動壓縮 JS 檔案,請確保您部署應用程式的實際工作環境版本。您可以用 React Developer Tools 擴充功能進行檢查。
WordPress
有些 WordPress 外掛程式可以透過串連、壓縮及壓縮指令碼來提升網站速度。您也可以使用建構程序來預先執行這項壓縮作業 (如果可行的話)。
資源
除非另有註明,否則本頁面中的內容是採用創用 CC 姓名標示 4.0 授權,程式碼範例則為阿帕契 2.0 授權。詳情請參閱《Google Developers 網站政策》。Java 是 Oracle 和/或其關聯企業的註冊商標。
上次更新時間:2019-05-02 (世界標準時間)。
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"缺少我需要的資訊"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"過於複雜/步驟過多"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"過時"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"翻譯問題"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"示例/程式碼問題"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"其他"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"容易理解"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"確實解決了我的問題"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"其他"
}]
{"lastModified": "\u4e0a\u6b21\u66f4\u65b0\u6642\u9593\uff1a2019-05-02 (\u4e16\u754c\u6a19\u6e96\u6642\u9593)\u3002"}
[[["容易理解","easyToUnderstand","thumb-up"],["確實解決了我的問題","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["缺少我需要的資訊","missingTheInformationINeed","thumb-down"],["過於複雜/步驟過多","tooComplicatedTooManySteps","thumb-down"],["過時","outOfDate","thumb-down"],["翻譯問題","translationIssue","thumb-down"],["示例/程式碼問題","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["上次更新時間:2019-05-02 (世界標準時間)。"],[],[]]