FC2ブログ

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Closure Compilerを使ってJavaScriptコードを圧縮する

githubでソースを公開するようにしたので、GAEにアップするJavaScriptコードを圧縮することにした。
圧縮ツールはいろいろあるが、Googleが提供しているClosure Compilerを使うことにした。
日本語資料は Closure Compilerを使う! が詳しい。

Closure CompilerにはWeb版の Closure Compiler Service UI があるが、一定時間内で連続して利用できる回数などに制限がある。

ローカルPCで圧縮を行う場合、Closure Compiler Application を使用する。
JRE6以上がインストールされていれば、jarファイル1つをダウンロードするだけで特に設定作業は必要無い。

試しにPre3dのコードを圧縮してみた。
windowsの場合、コマンドプロンプトを起動し、compiler.jar のあるフォルダにcdしてコマンドを実行する。
>java -jar compiler.jar --js ..\pre3d\pre3d.js --js ..\pre3d\pre3d_shape_utils.js --js ..\pre3d\pre3d_path_utils.js --js_output_file ..\pre3d\pre3d.min.js
ファイルを圧縮するだけであれば、コマンドオプションは入出力ファイルを設定するだけでいい。
上記のコマンドを実行した結果、合計 66.9KB が 17.8KB になった。圧縮率 26.6% だ。
デフォルトのCompilation LevelsはSIMPLE_OPTIMIZATIONSなので、グローバル変数名は変わらない。
コマンドオプションの詳細は Closure Compiler Application:コマンドラインオプション を参照。
デフォルトの文字エンコーディングは UTF-8 なので注意。

圧縮する際、きちんと構文解析してエラーチェックをする。
  var a = {
    a0: 1,
    a1: 2,
  };
のような、IE7以前でエラーになるケースもチェックしている。
文末の ; が無いと圧縮後ファイルが壊れることも無い。
Closure Compilerは、ファイルサイズよりもgzip圧縮されたときのコードサイズを優先するので、圧縮後のファイルサイズが大きくなるケースがある。

JSDocの @license タグをサポートしており、
/**
 * @license Pre3d, a JavaScript software 3d renderer.
 * (c) Dean McNamee , Dec 2008.
 */
と記述すると、この部分は圧縮されずに
/*
 Pre3d, a JavaScript software 3d renderer.
 (c) Dean McNamee , Dec 2008.
*/
と出力される。圧縮後のファイルに著作権表示などを書く手間がはぶける。

ざっと使ってみて、JavaScriptコード圧縮ツールとしてかなり使えることがわかった。
更に Compilation Levels を ADVANCED_OPTIMIZATIONS にして使用したところ、コードの品質向上にも使えることがわかった。
次エントリでADVANCED_OPTIMIZATIONSについて解説する予定。
<追記>
コードの品質向上について書きました。
[Closure Compiler]型定義チェックでコードの品質を向上する
型定義チェックはデフォルトのSIMPLE_OPTIMIZATIONSでも可能でした。
スポンサーサイト

コメント

コメントの投稿

非公開コメント

プロフィール

himax64

Author: 南西
30代後半の無職です。
就活もせずダラダラ生きてます。
作ったもの

最新記事
人気記事
検索フォーム
カテゴリ
月別アーカイブ
最新コメント
最新トラックバック
RSSリンクの表示
QRコード
QRコード
カウンター
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。