最近のJSの開発環境について知っておくべきライブラリ10個
ほんとに10個だと思った？（無意味に煽っていくスタイル）
最近JSだけのリポジトリで無益なゲームを大量に作っては破棄しているのだけど、割とストレスなく出来上がってきたので書く。
長々と書くが、要は次のリポジトリに概要が詰まってる。
mizchi/mizchi_client_boilerplate · GitHub https://github.com/mizchi/mizchi_client_boilerplate
前提として、最近はCSJSでもnodeのインストールを前提とする環境が多い。必須といってもいい。
grunt
gruntjs/grunt · GitHub https://github.com/gruntjs/grunt
ビルドタスクを簡単に作れる。make、rake、などに相当するが、node製らしくファイルシステムの監視でアクションを作れるのが特長。$ grunt serverで簡易サーバーも立てられる。
- coffeescript/typescriptの自動コンパイル、結合、minify
- sass/compassの自動生成
プラグインが大量にあって追加も簡単。ググればだいたい見つかる。
watchタスクにcoffeeのコンパイル手順を書いて、$ grunt watch server、みたいな使い方するとlocalhost:8000に簡易サーバーを立てつつ裏でファイルシステム監視しつつcoffeeの自動コンパイルしてくれて便利。
bower
twitter/bower · GitHub https://github.com/twitter/bower
Twitter製のクライアントサイドjs依存管理ライブラリ。gemとかnpmだと思ってもらえば問題ない。
component.json みたいなファイルを書いて、 $ bower install すると components/以下に保存される。require.jsに対応している。
{
"name": "MyProject",
"version": "0.0.1",
"dependencies": {
"underscore": "latest",
"jquery": "latest",
"requirejs": "2.1.1"
}
}使いたいライブラリがbowerに登録されていないことが多いが、バージョン名のところにgithubもしくはホスティングされているURLを直接参照すれば解決する。
yeoman
yeoman/yeoman · GitHub https://github.com/yeoman/yeoman
CSJS開発環境の総合フレームワーク。日本の紹介記事だとgruntと対になるような紹介をされていることが多いが、実際の中身はgruntのラッパーライブラリである。
angularやemberを試してみたいときに、おもむろに $ yeoman init angularすると雛形が出来上がって、気軽に試したいときにすごい便利。
紹介はするけど、ぶっちゃけ自分ではあまり使ってない。あまりにもyeoman流儀を強制されて、Railsの吐き出したディレクトリを最初に目にしたような目眩を感じる。僕のようにこの流儀が受け付けない人は、何も考えずに他人のboilerplate眺める用途に使おう。
require.js
RequireJS http://requirejs.org/
最近のJSの依存管理のデファクトなのだが、自分はあまり好きではない。
名前空間を決めて使おう！ってのはモダンなJSだと当たり前のことなんだけど、そんな当たり前の糞な規約を守れない糞JSコーダーを、require.jsという枷に入れてどうにかします、みたいな印象を受ける。
未だに自分のローカルの依存解決は gruntのconcat順で解決していてダサい(しデバッグしづらい)のでなんとかしたいのだけど、require.jsの規約はもっとダサい。ライブラリのインスタンスをコールバックで受け取るっていうのも、そのために無駄にネストを深くするのも、ちょっと嫌だ。
でもまあ、TwitterがFlightやBower等で使うことを強制してきてるし、外部ライブラリ間の依存解決もできるし、たぶんこれから標準になるんだろーなといった印象。TypeScriptもmoduleを使うと内部構造はrequire.js準拠になるオプションがある。
peerjs
PeerJS http://peerjs.com
つい先日リリースされたばかりで、WebRTCでクライアントサイドP2Pを実現する、そのAPIを使いやすくしたライブラリ。おそらくsocket.ioに似せたものなので、使ったことがある人にはわかりやすい。
クライアント間でハンドシェイクするためのstunサーバーもpeerjs.comで提供してくれている。(npm で自分で立てても良い)
今現在ChromeDevでしか動作しないが、自分でサーバー立てずにlocalStorageとp2pだけで「ウェブ」アプリを作ることもできる。そんな未来もある。HTML5でゲーム作ってる人はウェブサーバー管理しなくていいってのはすごい利点だと思ってる。
その他MVCフレームワークについて雑感
Backbone
無難に便利なんだけどCollection, Model部分はその他モジュールと綺麗に切り離されているので、そこだけ使いたいケースが多い。Viewはイベントハンドラとして使うと便利。
Backbone使いはよく言うんだけど、このライブラリはコード量が減る方向には貢献しない。
Angular
あんまりガッツリ使ってないんだけど、DOMツリーが名前空間を表象するのは自分にはちょっと受け入れがたい。抽象度が低く規約が多い。HTMLとデータ構造がそのままビューに反映するアプリには良いとは思う。裏で大量のロジックが走るようなアプリには向いてない。
Ember
Railsの規約をそのまま持ってきすぎで、ルーティング制約とそのモデル対応がきつい。シングルページアプリケーションしか作ってない身だと有り難みがなかった。
おそらくRailsとの親和性が高いのでRails組み込みとして使うと真価を発揮するんじゃないだろうか。まだそんな時代じゃない気もするが…。
疲れたのでこのへんで終了。
そうそう、Railsは4.0で遷移アクションがデフォルトpushStateになるらしいので、つまりはJSオブジェクトを破棄しない。グローバル汚染が厳しくなるので、より慎重なJSを書く必要があるし、遷移時のオブジェクトの再生成コストがなくなるのでJSの仕事が多くなると思われる。
