使ってみよう！「Closure Tools」 #1 ～Closure Toolsとは？～

毎度お世話になっております。クラスメソッドの稲毛です。

今回より『使ってみよう！「Closure Tools」』と題し、Googleが公開しているClosure Toolsをターゲットとした連載を開始します。本連載を通してClosure Toolsに興味を持って頂き、今後のHTML+JavaScript開発の一助となれば幸いです。

Closure Toolsとの出会い

私は、普段使用している開発言語がクラスベースのオブジェクト指向言語である為、プロトタイプベースのオブジェクト指向言語であるJavaScriptでの開発に対するイメージがいまいち掴めず、「HTML+JavaScriptの開発というものはどのように進めていけば良いのだろう……。」というモヤモヤ感を持っていました。そんな中、JavaやActionScriptのようにクラス毎にファイルを作成するスタイルで開発できないものかと調べていた時に出会ったのがGoogleが公開しているClsoure Toolsでした。

Closure Toolsの構成

Closure Toolsはその名の通り複数のツールから構成されています。

• Closure Compiler
• Closure Library
• Closure Templates
• Closure Linter

Closure Compiler

Closure Compilerは、ソースとなるJavaScriptを解析し最適化することにより、元のソースよりもサイズが小さく高速に実行されるJavaScriptを生成する為のツールです。

例えばこのコードは

function hello(name) {
  alert('Hello, ' + name);
}
hello('New user');

このように最適化されます。

function hello(a){alert("Hello, "+a)}hello("New user");

Closure Compilerは最適化のレベルを指定することができ、より「高度な最適化」を行うことが可能です。「高度な最適化」についても連載の中で取り扱う予定です。

Closure Library

Closure Libraryは、クロスブラウザのJavaScriptライブラリです。開発者は、下記のような機能が用意されたライブラリ群から必要なものだけをピックアップして利用することができます。

• コントロール等のUI部品
  • 例えば……
• DOM操作用の低レベルユーティリティ
  • 例えば……
• サーバ通信
• アニメーション
  • 例えば……
• データ構造
• ユニットテスト
  • 例えば……
• リッチテキスト
• その他

Closure Templates

Closure Templatesは、再利用可能なHTMLやUI要素の動的な構築を支援するテンプレートシステムです。

Closure Linter

Closure Linterは、JavaScriptファイル内の演算子の配置やセミコロンの記述忘れ、スペースの用法、JsDocアノテーションの有無などをチェックするユーティリティです。

これらのツール群は多くの方が普段お使いのGmailなどのGoogleプロダクトに利用されています。実は身近な所で使われていたのですね。

まとめ

今回は、Closure Toolsがどのようなツール群で構成されているか、どのようなプロダクトで利用されているかについてご案内しました。以後、本連載では「Closure Compiler」と「Closure Library」にフォーカスをあてて進めていく予定です。

次回は、Closure Toolsを使って開発を行う為の環境構築を行います。