Marionette.jsのスライドアップ+メリットとか書いてみた!



こんちは!basara669です。

最近こんな投稿ばかりなのですが、Backbone.jsをより便利にしてくれるフレームワーク、Marionette.jsを使って簡単なtodoアプリを作るというハンズオンの勉強会を行ったので、そこで使った資料をslideShareにアップしました。
それ以外にも使ってみたメリット・デメリットも書いています。

スライドの場所

このスライドはハンズオンで勉強会をやりました。必要なファイルはGitHubにあげたので、解説ないですけど、気になる人はダウンロードしてみください。

https://github.com/basara669/marionettejs_gettingStarted

Marionette.jsについて思うこと

メリット:RenderやDestroyの処理はラクになる

Marionette.jsで一番メリットって言われるところです。これはやはり便利でした。Viewを作成して、そこで読み込むModel指定して、show()メソッドを使用するだけで、Renderがされます。

Backboneだと何度も同じようなところを書く部分だったりするので、ここは大規模になればなるほど、メリットが大きい部分かなと思います。

また、内部でfindで処理してくれているなど、Marionetteの書き方に従えばそれなりにパフォーマンスの良いものに仕上がります。

メリット:モジュール化がわかりやすい

Backboneでもモジュール的な書き方は出来ますが、特に規定されているわけではなく、自分である程度規定しなくてはいけません。
その辺りはMarionetteが持っているので使いやすいかな〜と思います。

ただ、それでも大規模になれば、フレームワーク以外にもちゃんと設計指針みたいなものが無いとかなりゴチャゴチャになっちゃいますけどね(´・ω・`)

メリット:書き方が統一される

ここは実務的にはかなりメリットが高いかなと思います。backboneだとかなり自由な書き方が出来てしまうので、色々な方法で実装ができちゃいます。
Marionetteが入るだけで、ある程度書き方が強制されるので、同じような書き方に統一されます。

大枠のコーディングの指針を決めておくだけで、別々で作業しても結構問題なく進められたりします。

デメリット:Marionetteの法則から出るとつらい

これはフレームワーク全てに言えるのですが、フレームワークでサポートしてないような方法で実装しようとすると、いきなり辛くなったりする部分があります。
作りながら「こいつなんなんだよ〜!」って思うときはありましたw

特にviewのインスタンスを生成するとdivで囲まれてしまうので、その部分は本当に苦しみました…。

デメリット:日本語ドキュメントが少ない

Backboneは色々ドキュメントがあるのですが、Marionette.jsはほとんど無いです。。
なので、英語に抵抗があるとキツイかもしれないです。。

デメリット:アップデートが早い

これは良いところでもあるのですが、アップデートがかなり早いです。そして、そのたびに書き方がちょこちょこ変わります。

特に1系から2系に変わったのですが、たぶん1系のままのソースで2系を読み込ませると間違いなく動かないです。

ここらへんは極端に書き方を変えないでほしいな〜と思います…

あとがき

Marionette.jsはドキュメントが少ないので、とっつきにくいかもしれませんが、Backboneをかなり強化してくれるので、気になる人は少しチャレンジしてみると良いかも。

オライリーのBackbone.jsには少しだけ情報載ってます。

ではでは




コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

ABOUTこの記事をかいた人

Web Developer & Web Designer at Yahoo! Japan. Like HTML, css, JavaScript, Apple, ra-men, Angular, b-monster.