JSX

JSXa faster, safer, easier JavaScript DeNA Co., Ltd. Kazuho Oku

自己紹介  1997-2003 「Palmscape」「Xiino」の開発者  Palm OS用Webブラウザ (Sony, IBM, DoCoMo 等が採用)  JavaScript VMもフルスクラッチで書いていた  2004 IPA未踏「Webアプリ統合開発環境の開発」  スーパークリエータ認定  Perlのウェブブラウザ上でのデバッガ等  2005-2010 サイボウズ・ラボ  Japanize, Pathtraq – ブラウザ拡張を使うウェブサービス  Q4M – メッセージキュー (Mixi, livedoor, DeNA 等で利用)  2011- ディー・エヌ・エー  JavaScript 等、プラットフォーム技術の研究開発Aug 4 2012 JSX - a faster, easier, safer JavaScript 2

JavaScriptの問題 遅い 特にスマホ向けのゲームを作っていると デバッグに時間がかかる 例: プロパティ名の間違い 読みにくい さまざまな「クラス」実装や「華麗な」コーディングテクニックAug 4 2012 JSX - a faster, easier, safer JavaScript 3

解決策 独自のプログラミング言語を開発 JavaScript に静的な型機構を追加 like ActionScript 3 / EcmaScript 4 JavaScript への変換時に最適化 JavaScript より高速に！Aug 4 2012 JSX - a faster, easier, safer JavaScript 4

JSX とは? JavaScript より速く、開発効率が高く、成果物の品質が高いプログラミング言語あくまでも目標です！Aug 4 2012 JSX - a faster, easier, safer JavaScript 5

JSX の言語設計方針 静的型言語 できるだけ多くのエラーをコンパイル時に検出 開発効率と品質の向上につながる 式と文は JavaScript + 型指定 開発者がとっつきやすいように JS への変換におけるオーバーヘッドを最小化 デバッグ支援コードの挿入 静的なクラス構造 リンク時最適化を含むコンパイル時最適化Aug 4 2012 JSX - a faster, easier, safer JavaScript 6

なぜ新言語なのか? ActionScript 3 ウェブブラウザで動かない JavaScript へ変換できなくはないがオーバーヘッドが発生 型がオプショナル Dart JavaScript へ変換するオーバーヘッドが発生 型がオプショナル Coffeescript 静的型でなく、大規模むけでないAug 4 2012 JSX - a faster, easier, safer JavaScript 7

JSX の最適化 const-folding, inline-expansion, unboxing, … Box2D ベンチマーク box2d.js を JSX にポーティングして fps を測定 iOS 5.0 - 12%向上 Android 2.3 – 29%向上Aug 4 2012 JSX - a faster, easier, safer JavaScript 8

JSX の最適化例: アフィン変換 ソースコード: new Matrix(1, 0, 0, 0, 2, 0).transform(new Point(x, y)) コンパイル結果: {x: x + 0 * y, y: 0 * x + 2 * y} 注: 0 * n は isNaN(n) ? NaN : 0 と等価のため畳み込めないAug 4 2012 JSX - a faster, easier, safer JavaScript 9

Hello world! class _Main { static function main(args : string[]) : void { log "Hello world!"; } }Aug 4 2012 JSX - a faster, easier, safer JavaScript 10

冗長？Aug 4 2012 JSX - a faster, easier, safer JavaScript 11

「リーダブルコード」より「コードは理解しやすくなければならない」Aug 4 2012 JSX - a faster, easier, safer JavaScript 12

開発効率と規模の関係 大規模なコードを書くのは大変 1,000行のプログラム – 1日 10,000行のプログラム – 10日? 100,000行のプログラム – 100日?? 重要性: キータッチの少なさ < 読みやすさ 8時間で1,000行*30桁コーディングしたとしても、約60文字/分Aug 4 2012 JSX - a faster, easier, safer JavaScript 13

書きやすさと読みやすさの両立 エディタによる補完 わかりやすい変数名 補完候補と、その機能の概要が表示されること 「class」を省略できるよりも、補完が効きまくるほうがうれしい そのためにも、構造化された文書化仕様を /** * description * @param a …Aug 4 2012 JSX - a faster, easier, safer JavaScript 14

そもそも… プログラミング言語は開発環境の一部Aug 4 2012 JSX - a faster, easier, safer JavaScript 15

開発環境に必要な機能 コード編集とリーディングの支援  jsx --complete  jsx --mode doc (kazuho/jsxdoc branch) テストフレームワーク  jsx --test ソースコードデバッグ  jsx --enable-source-map プロファイラ  jsx --profileAug 4 2012 JSX - a faster, easier, safer JavaScript 16

開発環境に必要な機能 ライブラリサポート 考え中… だって（まだ）ライブラリないし… むしろライブラリ書いてくれる人募集中です！Aug 4 2012 JSX - a faster, easier, safer JavaScript 17

まとめ JSX は、より速く、より簡単で、より安全な JavaScript の方言 開発環境の一部として言語を設計・実装 人柱^H^Hユーザー募集中ですAug 4 2012 JSX - a faster, easier, safer JavaScript 18

https://si0.twimg.com	33
https://twitter.com	24
https://twimg0-a.akamaihd.net	22
http://us-w1.rockmelt.com	3
http://nuevospowerpoints.blogspot.com	3
http://tweetedtimes.com	2
http://nuevospowerpoints.blogspot.com.au	2

JSX

by Kazuho Oku on Aug 04, 2012

Accessibility

Categories

Upload Details

Usage Rights

7 Embeds 89

Statistics

JSX Presentation Transcript