Closure CompilerのES6対応 あるいはES6時代のAltJS生存戦略
20 likes18,431 views
ES6+カジュアルトークの発表資料です。 http://connpass.com/event/9113/
Closure CompilerのES6対応 あるいはES6時代のAltJS生存戦略
- 1. Closure CompilerのES6対応 あるいは ES6時代のAltJS生存戦略 @teppeis ES6 Casual 2014/10/29
- 2. Hello! • @teppeis • cybozu kintone • Closure Compiler, TypeScript, Testing, Scaling..
- 4. Closure Compiler • compile JS to better JS • 超圧縮＆最適化 • JSDocベースの静的型付け
- 5. あなたも毎日使ってます！
- 7. JSDocベースの静的型付け • 冗長だけど、既存のJSとの親和性がバツグン • JavaScriptの進化に追随できる（後述） • コンパイルなしでも実行可能 • どうせJSDoc書くし。 まさか、ドキュメント書かない気ですか？
- 8. 5月にGitHub化
- 9. 活発に開発中
- 10. 最近何やってんの？ • ECMAScript6対応 • 型推論の強化 • RefasterJS（自動リファクタリング） • Conformance（規約チェック）
- 11. ECMAScript 6
- 12. Compile ES6 to ES3 java -jar compiler.jar --language_in ECMASCRIPT6 --language_out ECMASCRIPT3 --js foo.js
- 13. Arrow Function
- 14. Class
- 16. Default, rest, spread params
- 17. and already supported ! • const/let • Generator • Destructuring • String templates • Binary & octal literal • …
- 18. 実装中の大物 • Modules • super (Class)
- 19. ES6 compatibility table 各種ブラウザとコンパイラのES6対応表 http://kangax.github.io/compat-table/es6/
- 22. 対応状況のチェックを自動化 • かなりの書きなぐりコード • 6to5とかも対応しようと思ったけど面 (ry
- 23. Why doesn’t Closure use Traceur?
- 24. Tracuerを使わなかった理由 • Tracuerは変換結果にコメントを残せない • Closure CompilerではJSDocが肝 • パフォーマンス問題 • TraceurはJS実装、ClosureはJava実装 • ASTとソースの変換が2回
- 25. コンパイルのコスト • Traceur + Closure • ES6 > Traceur AST > ES5 > Closure AST > Optimized ES5 • Closure only • ES6 > Closure AST (ES6 > ES5) > Optimized ES5
- 27. ちょｗ
- 28. Tracuerの微妙なところ • 自前で実装する基準がよくわからない • String.prototype.startsWith とか • そのおかげでランタイムがめちゃでかい。 • コンパイル不要な機能は es6shimに任せれば良いのでは？
- 29. ES6 vs. AltJS
- 30. AltJS黎明期 • 各種AltJSがオレオレ最強Syntaxを実装 • そのうち有用なものをES6/7が取り込む • ES6だけでも十分モダンなsyntaxに • 各ブラウザとコンパイラがES6対応開始 • いまここ
- 31. AltJSの選定基準 • そのコンテキストにおけるJSの不満を解決 • 主目的はそれぞれ • 学習コスト、開発者の確保 • ECMAScriptベースだと楽じゃない？ • AltJSからの出口戦略（プロダクトとAltJSどっちが長生き？） • 開発の継続性 • コミュニティが活発 • 強力な後ろだて（政治） • 移行コスト • 元コードがキレイ or 生成コードがキレイ（標準に近い）
- 32. ECMAScript準拠の強み • Closure Compilerは基本文法はJSそのまま • JS (ECMAScript) が進化すれば、 Closure Compilerも合わせて進化できる • 独自syntaxのAltJSではそうもいかない • 進化しないと、機能落ち、 類似だけど微妙に違う仕様、などに陥る
- 33. ES6時代のAltJS • 欲張らないES6ベース + 独自色（主目的） • Closure（型、圧縮） • TypeScript（型） • AngularJS AtScript（型、アノテーション） • Facebook Flow（型、高速化？）
- 34. 型ばっかりでゴメンw • でも Google, Microsoft, Facebook, ビッグネームが型付きJS始めたのは 偶然じゃあない。 • ECMAScript Types が提案に（次の発表で！） • 最強の出口戦略: 標準化 • 来るか大統一型定義時代！
- 36. Thanks!