YUI CompressorでJavascriptを圧縮する


Javascriptライブラリをgzip圧縮する | blog.remora.cx」では一つの Javascript を gzip 圧縮する話を書いた。しかし gzip で圧縮する前に、ライブラリ内のコメントや空行など、動作に支障のない部分を削ってしまった方が更に効果は高い。勿論それは手作業でも可能だが、ツールを使った方が確実で早いだろう。今回は YUI Compressor を使ってみることにした。

YUI Compressor
http://developer.yahoo.com/yui/compressor/

ダウンロードとインストール

ダウンロードして解凍すると、build ディレクトリの中に実行ファイル(jar 形式)が現れる。

$ unzip yuicompressor-2.4.2.zip
$ cd yuicompressor-2.4.2/build
$ ll
total 1664
-rw-r--r--@ 1 delphinus  staff  851219 11 14  2008 yuicompressor-2.4.2.jar

実行には Java 実行環境も必要なのでインストールしておこう(Mac OS X では標準で入ってるっぽい?)。

java.com: あなたと Java
http://www.java.com/ja/

実際に圧縮してみる

例として、SyntaxHighlighter プラグインに使われる多数の Javascript を一つに纏めて圧縮してみる。このプラグインでは各言語に対応するためのファイルが「shBrush言語名.js」の形式で用意されている。本当なら使いたい言語だけピックアップして纏めるべきなのだが、今回は面倒なので全部一つのファイルにしてみた。

$ cd mt-static/plugins/SyntaxHighlighter/2.0/scripts
$ cat shBrush*.js > shAll.js
$ java -jar ~/yuicompressor-2.4.2.jar -v --charset utf8 shAll.js > shCompressed.js

圧縮した結果の容量を比較してみると次のようになる。

圧縮無し 71,764 byte 100%
YUI Compressor 39,030 byte 54%
gzip 15,904 byte 22%
gzip + YUI Comp. 12,526 byte 17%

YUI Compressor だけで半分くらいの容量になった。これはスゴい。更に gzip と組み合わせることで約 6 分の 1 にもなってしまう。これを使わない手はないね。

コメントを残す