為什麼要縮小 Javascript 程式碼?

JavaScript 縮製可以透過減小檔案大小來提高網頁效能。

學習目標

閱讀本文後,您將能夠:

  • 定義 JavaScript 縮製
  • 瞭解醜化、混淆和加密

相關內容


想要繼續瞭解嗎?

訂閱 TheNET,這是 Cloudflare 每月對網際網路上最流行見解的總結!

請參閱 Cloudflare 的隱私權政策,了解我們如何收集和處理您的個人資料。

複製文章連結

使用 Cloudflare Pro 方案和我們的速度工具附加元件來提高網站效能

JavaScript 中的縮製是什麼?

縮製也稱為最小化,是在不改變其功能的情況下從 JavaScript 原始程式碼中移除所有不必要字元的過程。這包括移除空白字元、註釋和分號,以及使用更短的變數名稱和函數。JavaScript 程式碼的縮製可以讓檔案大小緊湊。

例如,下面是縮製之前和之後的程式碼區塊:

縮製之前:八行程式碼

沒有縮製的 JavaScript

縮製後:單行程式碼

縮製後的 JavaScript

縮製可加快網頁載入速度,從而改善網站體驗,使訪客和搜尋引擎都感到滿意。

縮製與混淆、壓縮、加密或醜化有何不同?

  • 醜化:這基本上與縮製相同。醜化 JS 是一個用於縮製 JavaScript 檔案的 JavaScript 庫。「醜化」JavaScript 檔案就是使用 Uglify 來縮小它。醜化可提高效能,但會降低可讀性。
  • 加密:這是將資料(稱為純資料)轉換為編碼資料的過程。這種加密或編碼的資料被稱為加密文字,需要一個祕密金鑰才能對其進行解密。瀏覽器無法執行加密程式碼。加密是一項安全功能,不一定會減少檔案的大小。
  • 混淆:採用此過程是為了隱藏業務邏輯。程式碼被修改為人類無法閱讀,這使得逆向工程變得困難。混淆與加密的不同之處在於電腦仍然能夠理解和執行程式碼。混淆是透過變更變數、函數和成員的名稱來實現的。檔案大小的減少也提高了效能,儘管這不是混淆的主要目標。
  • 壓縮:資料壓縮是一種減少表示資料所需的位元數的過程。資料壓縮可釋放硬碟上寶貴的空間、加速檔案傳輸速度,並降低網路頻寬成本。某些檔案(如 Microsoft Word 檔案)可能會壓縮到其原始大小的 90%。

為什麼開發人員不從一開始就編寫縮製的程式碼?

縮製會產生壓縮檔案,這使其成為 Web 效能的最佳做法。那麼,為什麼不編寫已經縮製的程式碼呢?

JavaScript 程式碼是為了人類並且也是由人類來編寫的,他們需要空格、格式和註釋才能理解程式碼並進行偵錯。編寫程式碼後,可以使用縮製軟體以提高效能。因為瀏覽器不需要理解程式碼就可以執行。

縮製有什麼缺點?

由於主題、外掛程式和伺服器環境等網站相關變數,縮製可能會破壞複雜的指令碼。此外,縮製必須與其他效能調整一起完成。就其本身而言,它可能不會帶來顯著的收益。縮製還會引入難以偵錯的錯誤。

儘管存在這些缺點,但為了潛在的效能提升,縮製通常值得嘗試。同時瞭解如何縮小 CSS