跳到主要內容

使用Google Closure壓縮Javascript檔案

Google Closure是滿常被使用的開源JavaScript壓縮器
GCL的GitHub page:https://github.com/google/closure-compiler
GCL線上版本:http://closure-compiler.appspot.com/home

其餘主流的壓縮器介紹可以看談以壓縮、cache機制加速網路應用
以壓縮比例來說,GCL會較YUI compressor略好一些
這是因為兩者的機制有所不同

兩種壓縮器都提供3種層級的壓縮
最簡單的壓縮就是移除JavaScript檔案中的空白、換行符號
接著是預設的基本壓縮
除了不會變動全域變數、函式外,區域變數會重新命名以進一步減少檔案大小,一部分的多餘程式也會被移除
進階壓縮才是兩者的差異,YUI compressor純粹解譯JavaScript的程式碼文字
而Google Closure是compiler,會重新編譯成新的JavaScript code
也因為如此,GCL對於程式碼的要求比較嚴格,也是有些人會反映編譯時容易報錯
就我個人來看,設計師要求自己的code能通過JSHint、JSLint是基本條件,所以不覺得是問題

一般的開發者可以先用線上版本試試看GCL的特色
注意進階壓縮連全域變數、函式的名稱也會修改,所以是處於不安全的狀態
如果設計師有其他的地方會用到這些全域變數、函式,很可能會碰上錯誤

除了單一檔案的壓縮外,把好幾個JavaScript檔合併壓縮成一個也是常見的需求
發出多個request來取得多個JavaScript檔的缺點在於,request本身也會占用連線頻寬
所以產出唯一的、壓縮過的JavaScript檔案會是較有效率的做法
當然這時候就不適用線上版本來完成這項工作,以下介紹在local端的使用

首先從project網頁下載檔案,下載後解壓縮可以得到 compiler.jar
如果開發時有用到Ant等工具的話可以使用其工具
我就只是簡單的寫一個bash檔在windows環境使用它,建立一個純文字檔並重新命名副檔名為 .bat

compileJs.bat====
java -jar compiler.jar  --compilation_level ADVANCED_OPTIMIZATIONS  --js a.js  --js b.js  --js_output_file min.js


-jar 選擇要執行的jar檔,在這裡選擇compiler.jar
--compilation_level 這句指定壓縮層級,有以下三種可以選擇
WHITESPACE_ONLY
SIMPLE_OPTIMIZATIONS
ADVANCED_OPTIMIZATIONS

不加上壓縮層級指定也可以執行,會自動套用預設壓縮層級

要壓縮JavaScript檔案以 --js  JavaScript檔案 形式條列在後
最後產出檔案的命令則是 --js_output_file 產出的Javascript檔名稱
專案使用壓縮產生的javaScript檔案理論上會維持原有的操作效果(如果程式碼沒有編譯錯誤)

這個.bat檔不涉及路徑的變化,路徑的變化需要搭配 cd 等bash 指令,這裡不多提
反正開發時大多會將JavaScript檔放在同一個目錄下
把compileJs.bat和compiler.jar一起丟進去後,點擊compileJs.bat啟動執行就ok了

留言