Hatena::ブログ(Diary)

naoyaのはてなダイアリー

May 08, 2013

Backbone.jsガイドブック

Backbone.jsガイドブック
Backbone.jsガイドブック
posted with amazlet at 13.05.07
高橋 侑久
ラトルズ
売り上げランキング: 2,459

Backbone.js ガイドブックを一通り読みました。言及するか少し迷ったけど、まだあまり話題になっていないようなので書いておこうと思います。

Backbone.js あるいはこれによく似たようなフレームワークは今後、Webアプリケーション開発でよく使う道具になっていくと思う。というか、すでになっているでしょう。

Backbone.js は「クライアントサイドMVCフレームワーク」と呼ぶと良くわからない。クライアントサイドMVCフレームワークが注目される以前から、ある程度以上の規模の JavaScript アプリケーションになるとちゃんとしてるものは構造化が行われていた。イベントを集約するオブジェクトを作って、ドメインロジックに相当する部分は切り分けて、画面の更新はイベントを発行して pub/sub モデルで書く・・・ 腕の良い JavaScript プログラマが書いた JavaScript アプリケーションはだいたいそんな感じになっている。

「へえ、こんな風に書くんだねえ」と思いながらも、よしじゃあ自分も・・・といざやってみると、なんだかうまくいかない。How To だけ知っていて、構造化されたアプリケーションモデルが頭の中にちゃんと描けていないから。これじゃいかんなあ、と「モダンJavaScript」的ないろんな本を読んでみるんだけど、prototype チェインはこうなっているとか new を使うなとかそういうことは延々と書いているのに、肝心のアプリケーション構造化についてきちんと触れているものはなかなか無い。「大きくなったときに破綻するよねえ」と分かりながらも jQuery のイベントハンドラをべたに書いていく・・・。

そういう人に「あなたもこれを使えばできますよ」という指針と実装を与えてくれるのが Backbone.js だと思う。

Backbone.js を使うと綺麗に構造化された JavaScript アプリケーションを書くことができる。ただ、昨今のWebアプリケーションフレームワークなんかと違って、さすがに JavaScript のグローバルスコープを押さえ込んで "Backbone Way" を強制するほどの強い制約は、このフレームワークにはない。例えば、Backbone.js の流儀に従わずにモデルクラスの中で jQuery で責務範囲外の DOM を操作してしまったら設計は破綻するけどそれを不可能にする制約はどこにもない。だからそこはフレームワークに身をゆだねるのではなくちゃんと意識して Backbone の流儀に従ってコードを書かなければならない。

でも、公式の文書含め、Backbone.js のチュートリアルや入門記事なんかを幾つか読んでみたけれども、その Backbone.js の流儀的に「こういう場合はこういう風に書く」とか逆にこれはアンチパターンだという風に説明しているものはあまり見なかった。Backbone.js で TODD アプリケーションを作って、Backbone で書くとこうなります・・・止まりだ。肝心の部分が結構な暗黙知になってしまっている。

Backbone.js ガイドブックにはその Backbone.js の流儀がちゃんと解説されている。これがとにかく良かった。

Backbone の MVC では V に View と Controller が内包されていて、View に実装されるメソッドは Controller メソッドと View メソッドという二つに種類に分類することができる。そして Controller メソッドで DOM のイベントを Subscribe し、そのイベントを契機に Model を操作する。画面の更新は、その Model の操作に伴って発火されたイベントを契機にした View メソッドとして実装すべきである・・・ つまり 「DOM → イベント → Controller メソッド → Model → イベント → View メソッド → 画面再描画」という流れになるように書くべき。既存の Backbone アプリケーションを読むときも、そこに着目すれば処理の流れを逐次で追えるので分かりやすい・・・ など、こんなことが書かれている。

というわけで、"自分にとっては" 良著だった。ちょうど今作っている Webアプリケーションに、苦手な JavaScript での実装が必要になって、いいタイミングでこの本が手元に届いたのであった。*1

けど "自分にとっては" とそこは断りをいれておこう。少々、書籍の構成に難がある。端的に言うと、この書籍は「Backbone.js ガイドブック」であり「Backbone.js 入門」ではない。Backbone.js の本質的な考え方、ベストプラクティスは語られている一方、Backbone がどんなものか分からない初学者に向けた構成にはなっていない。Backbone.Model、Backbone.Collection、Backbone.View と Backbone を構成するクラス群の割と詳細な解説が続いたあとようやく TODO アプリケーションの解説、みたいな構成になっていて、おそらく、Backbone.js をある程度知らないと途中でめげる。実際自分は Backbone.Router や Backbone.sync を多用するアプリケーションは書いたことがないので、その辺の章は前提知識が欠けているために負荷が高く感じた・・・ようするに消化仕切れなかった。あと索引がほどんど役に立たないとか、require.js とか Grunt の解説は若干中途半端感があるし、ほんとに必要だったのかとか少々ツッコミたくなる部分もある。

ま、Amazon の商品説明を見ると、そもそも初学者は対象にしていないのかもしれない、と思う。もし Backbone.js を一通り触ってみたけど、Backbone を使ったときの実装にまだ迷いが多い・・・という自分のような人は手に取ってみるとよい本だと思います。

まずは Backbone.js 入門から・・・という人は ドットインストールの Backbone.js 入門 あたりがいいんじゃないかな。これもいきなり「では Model を作っていきましょう」とかで入っていくので最初は戸惑うけど、一通り作業を目で追えばだいたいどんなものか、が分かるとは思います。ただし、解説男性の男前の声を延々聞き続ける苦行に耐えられるなら、ですけども。

2013年9月26日 追記

本書の内容を補う形で、著者による連載がはじまったようです。参考にされたし。

*1:これは献本ではなく自分で購入した本です。わざわざこんなことを表明しないといけない昨今にポイズン

トラックバック - http://d.hatena.ne.jp/naoya/20130508/1367969771