昨日の続き。
- 素晴らしき元ネタ ASP.NET MVC 4でjQueryを使って動的に部分ビューを更新させる
- 昨日のエントリー <mini> 縦書きメーカー [TypeScript]、Thanks to 酢酸さん (@ch3cooh)
概要
- たてがきめーかーの紹介
- Closure を使ってみた件。
- まとめ
1. たてがきめーかーの紹介
軽く作った「たてがきめーかー」: http://mntone.minibird.jp/lr2tb/
スクリーンショットにあるようにあんな感じで動的に表示されます。技術仕様については Knockoutjs しか使ってなくて、Knockoutjs を活かした感じになってます。気になる方は GitHub にでもコードおいておくので読んでみてください。
GitHub: https://github.com/mntone/lr2tb/
2. Closure を使ってみた件。
Closure とは Google 製の JavaScript 最適化ツール。ECMAScript 3 に対応しているみたいです。基本的に TypeScript はそのままを尊重するツールなので、圧縮や最適化は施されません。そこで、tsc (TypeScript Compiler) で複数ファイルを 1 ファイルにまとめたその結果に対して、Closure で最適化を書けるというプロセスをとってみました。
私は基本的に Visual Studio プロジェクトで使ったので、ビルド後のお楽しみに次のようにいれました。
java -jar "{closure_path}\compiler.jar" --js ..\appx.js --js_output_file=..\appx.min.js
特にオプションを入れていませんが、もっと最適化したりなどのオプションもあります。めんどくさい (いろいろ最適化入れると省略されないようにしたりしないとかまあめんどくさくなる) のでいじってませんが。
基本的に、GZip を考慮されて作られているみたいで、改行とか文字列とか GZip 向けに最適化が施される感じらしいです。なので、いじらないほうがいいかも。わざわざいい感じにしてくれてるので、気にしない方針で。
3. まとめ
Less, Closure, TypeScript など今風のものにいろいろ触れてみているんですが、まだまだ知らないこといっぱいあるなぁ、って感じです。いろいろ触れてみた感想でも書いてみるかな?
Less に関してだけど、計算されてほしくないところが計算されちゃうのが難点だったりする。つまりその逆もあったりするわけだけども。ただ、それに関してはうまく付き合えば何ともないし、入れ子構造とかそのあたりやりやすいのが特徴かな。
Closure だけど、予約語、ブラウザー上では衝突しないけど、Closure では衝突するとかあるみたい。そのあたりの違いが多少あったりするのはとりあえずかけてみていろいろ探らないとダメ。エラーの位置がおかしいので特定に時間かかっちゃうってのもちょっと難点かな。ただ、圧縮効率とか考えるといいのかもね。
TypeScript だけど、JavaScript から大きく乖離してないってのがいい。JavaScript とは別言語になってしまうと、もはや JavaScript 以外の言語書くなら書きなれた C# とかからコンパイルできるようにしたほうがよくね? ってなったりするので、この程度がちょうどいい。
そういう感じで、今回はこれらの技術に触れていますのでよかったらいろいろ見てみるといいかと。