Closure Compilerの使い方

Closure CompilerというGoogle製のJavaScriptの最適化ツールが有ります。

このツールを使うと余分な空白や改行を削除したり、変数名を短いものに変更したりするなど様々な最適化を行ってくれます。

また、その様な最適化の他にJavaScriptファイルの連結も一緒に行ってくれます。

色々なライブラリを使うとJavaScriptのファイルが複数になったりする場合も多いかと思います。しかし、複数のファイルをDLするとなると単一ファイルをDLするより速度が落ちてしまいます。

その様な時にClosure Compilerでコンパイルを行うとその様な部分についても最適化出来ます。

使い方は至って簡単で、こちらの「Download the application」のリンクからClosure CompilerをDL。

※Javaがインストールされてない場合は別途インストールの必要有り。

そしてこの様な引数で実行すればOKです。

java -jar compiler.jar --js=in1.js --js=in2.js ... --js_output_file=out.js

--js= で入力ファイルを指定し、 --js_output_file= に出力ファイルを記入するだけの至ってシンプルな作りです。

試しに以前こちらのエントリーの為に作成したこちらのサンプルに使っているJavaScriptファイルを圧縮してみます。

このサンプルではJavaScriptを2つ以下の様な順番で読み込んでいます。

        <script type="text/javascript" src="enchant.js"></script> 
        <script type="text/javascript" src="01.js"></script>

01.js は enchant.js に依存している為、読み込みの順番はこの順番で無いとダメです。その場合Closure Compilerの引数に記述する順番もこの読み込み順に指定する必要が有ります。今回の場合はこの様に記述します。

java -jar compiler.jar --js=enchant.js --js=01.js --js_output_file=main.js

これでJavaScriptファイルは1つにまとめられ main.js として出力されます。

コンパイル後、JavaScriptの読み込み部分はこの様に書き換えます。

        <script type="text/javascript" src="main.js"></script>

ちなみに今回は enchant.js(57757byte)、01.js(2613byte) で合計60370byteだったものがコンパイル後は23985byteとなり、

23985 / 60370 = 0.397

元サイズの約40%まで圧縮されました。

変換後のファイルの内容はこんな感じ。変換しても問題無い部分はなるべく短い名称に変更されていて、変換すると問題有る enchant などの名称の部分はそのまま変更されていないのが分かるかと思います。流石Google製、優秀ですね。

なお、このClosure CompilerはWebアプリ版や

Closure Compiler Service
http://closure-compiler.appspot.com/home

Web API版も有ったりします。

Getting Started with the API - Closure Compiler - Google Code
http://code.google.com/intl/ja/closure/compiler/docs/gettingstarted_api.html

強火で進め