LGTM.in GitHub Bookmarklet (LGBM) に My List 機能を追加しました(Reactを使用)。

LGTM.in にクールな新機能である My List 機能が実装されたので、LGTM.in GitHub Bookmarklet(長いのでLGBMと呼びます)からもその機能を利用できるようにしました。

実装にあたっては、興味の合ったReactを使ってみました。感想としてはこんな感じです。

  • MVCフレームワークではなくてUI(View)を構築するためのフレームワーク
    • フルスタックにSPAの構造を定義するものではない
    • Backboneなどと組み合わせることでAngularのようなフルスタックSPAフレームワークと同等になる
    • Polymerやvue.jsが同等のもの
  • コンポーネント間にまたがるデータのやりとりはコールバックで定義するので、コンポーネント同士に親子関係のない場合ややこしい
  • JSXにcoffeescriptや対応プラグインがありました)エディタが対応してないので、編集がちょっと大変(JSXを使わずに、JSだけで書くこともできるがこちらも別の意味で大変)
  • 基本的にJSXの記法でDOMを定義するので、デザインが大変そう
  • エラーメッセージがわかりにくいことがある
  • JSXという名称がDeNA製言語とかぶっていてググラビリティが・・
  • 機能の割にJSのサイズが大きい 参照
  • コンポーネントのライフサイクルによって呼ばれるハンドラを定義していくスタイルなのでiOSやアンドロイドのネイティブアプリのUIフレームワークと同じような感覚で使えそう。
  • Virtual DOM による高速化は複雑なUIを組む際に効果を発揮しそう。

今回のように、基本はマルチページで、あるページのUIをJSを使ってインタラクティブにしたいという時には結構いい選択かもしれません。ただ、やはりLGBMのような要件にはちょっとヘビーすぎるかなと思います。Fluxのようなアーキテクチャをアプリケーション全体に導入して、その中の一部分として使うというのが妥当な線なのかなあ。

あと、READMEにHerokuボタンも付けてみました。誰得かもですが、簡単にHerokuにデプロイして使うことができます。