» JSオジサン 「俺の話を聞け、5分だけでもいい」 #2

Webクリエイターのシゴトに役立つ勉強会@晴海トリトン

 【満員御礼!】JSオジサン 「俺の話を聞け、5分だけでもいい」 #2

こんにちは、Triton Creators Lab編集部です。

メンバーズとGoodpatchの共同協賛イベント【JSオジサン 「俺の話を聞け、5分だけでもいい」 #2】が2014年5月29日に開催されました。

JSオジサンとは

2014年3月より、JS大好き人の集いにより、「JSオジサン」が発足されました。
イベントは、お酒を片手に、登壇者のLTを聞くというもの。

2回目の開催となった今回も、前回同様に登壇者のアツイLTが炸裂しました。

話題のAngularJS

突然ですが、みなさんはAngularJSは使っていますか?

AngularJSとは、Google社が開発しているJavaScriptのフレームワークで、汎用性が高いと評判です。
今回のLTでも、takamarioさんがAngularJSを話題に上げていました。

AngularJSとは、MV*(公式サイトではMVWと名乗っています)という種類のフレームワークです。
活用することにより、コード量が削減される品質の差を小さくするなど、生産の向上が期待できます。

「でも、jQueryで事足りそうだし、変えるのは億劫」なんて意見も聞こえてきそうですが、、、

例えば、こんな事例に当たったことはありませんか?

AngularJSのメリット

仕様「追加ボタンを押したら要素を追加する」

そして対象となるDOMを探す・さがす・sagasu、、、

仕様の変更やデザインの変更により、解読が難しくなり、挙句動かなくなったり、、、

jQueryはDOMの変更に弱いんですが、AngularJSは、そんなDOM操作から解放してくれます。

モデルの状態を監視し、自動で値を更新してくれます。

また、評判通りの汎用性で、こんなことも簡単にやってくれます。

例えばユーザーの投稿記事に対して、LikeDislikeを評価できるコンテンツがあるとします。

ユーザーは最初にDislike(=0)を投稿したが、後からLike(=1)に変更した場合。

値の「review」の変更を検知してくれて、if以下のHTMLを切り替えてくれます。
そのため、画像のソースをいじる必要がありません。

こういった状態による分岐は、AngularJSが得意とするところです。
サーバーサイドよりも柔軟にこなしてくれます。

この他にも、配列をrepeatで一括表示できたり、バリテーションをしてくれたりと、
サーバーサイドはJSONを吐き出す以上の機能はあまり求められません。

これまでhelperで別ファイルにモジュール化していたようなものもAngularJSがやってくれるので、
サーバーサイドはビジネスロジックに集中することができるのです。

AngularJSのデメリット

もっとも、良いことばかりではなく、悪いところもあります。

例えば、Backbone.jsはMVCの最低限の機能のみを提供していますので、容量は軽いです。
それとは対照的に、AngularJSはフルスタックなフレームワークなため、容量が重たいです。
具体的な数字で言うと、Backbone.jsが20KBなのに対して、AngularJSは100KBになります。

また、学習コストも高く、使いこなすまでに時間がかかるのも難点です。

最後に

ただ、そういったデメリットも、それを補うだけのパフォーマンス向上が期待できます。
まだ使ったことがない方がいましたら、ぜひ一度使ってみてはいかがでしょうか。

ちなみに、今回LTでtakamarioさんからお話がありましたが、あの「note」もAngularJSで構築されているとのことです。

AngularJSの他にも、JScriptやJSRelなど、JSに関するアツイLTが終始繰り広げられました。
キャンセル待ち続出となっているこのイベント。
次回こそは参加します。

詳しくはこちら

https://atnd.org/events/50606
 

Page Top