javascriptが楽しくなってきた系

Javascript google closure

久しぶりにこっちで日記
最近いろいろ新しい物に手を出してますが、その中で気になったのが

  • node.js
  • Google Closure Library

です。最近よく聞くとと思いますけど…

node.js

node.jsはサーバサイドjavascriptですね。話は簡単で、以下のようなソースを書いて「sample.js」というファイルで保存して…

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello World\n');
}).listen(8124, "127.0.0.1");
console.log('Server running at http://127.0.0.1:8124/');

コンソールから

$ node sample.js

てな感じに起動すると、上記の例だと8124ポートでlistenしてくれます。これでブラウザからアクセスすると文字列が出るわけですね。簡単です。

これはですね、なかなかいろいろな可能性を秘めてますよ。いまとてつもなく楽しいです、これ。最近Javascriptが重要視されてきてますが、サーバサイドはJavaだPythonだ、とどうしても多言語に依存せざるを得ない状況でした。

これは純粋にJavascriptだけでアプリが書ける、ということですね。

node.js

http://nodejs.org

Google Closure Library

こいつはですね、すごいですよ！←何が

要するにJavascriptライブラリなんですが、jQueryのようにAjax+DOM操作に加えて、いろいろなツールキットやユーティリティ、ネットワーク、イベント処理などなど、あらゆる機能を網羅した巨大ライブラリです。

ぶっちゃけこれを使えばもうjQueryのいいんだか悪いんだかわからないPluginを探しまくる日々から開放されます（言い過ぎか？ｗ）

このLibraryは正確には

  • Closure Library
  • Closure Compiler
  • Closure Template

の3つから構成されてます。Compilerは要はDeploy（公開）するときのJSファイルを最適化（難読化）してくれます。ClosureLibraryは開発時には利便性を考慮して非常に多くの分割されたJSファイルを読み込みます。

goog.require('goog.dom');

function sayHi() {
  var newHeader = goog.dom.createDom('h1', {'style': 'background-color:#EEE'},
    'Hello world!');
  goog.dom.appendChild(document.body, newHeader);
}

こんな感じにrequireで必要なものを読み込むんですが…まあjavaで言うところのimport文ですね。ただ、この1行でもブラウザで展開されるとJSファイルてんこ盛りでscriptタグに書きこまれます。依存関係がすごいですｗ

なので、そのまま手抜きしてClosureLibrary使うと重いです。マジで…

で、ようやくCompilerの話ですが、Compilerはrequireされる関連JSファイルから必要な部分だけを全部抜き出し、バイト数を削り、不要な改行や空白を削除して、1ファイルにしてくれるという凄い奴です。

Templateは…使ってないのでまだ知りません（笑）



てな感じで僕は現時点ではjQueryよりClosureLibraryに首ったけです