Mozilla Flux

Mozilla関係の情報に特化したブログです。

Mozilla HacksのWebAssembly連載記事の和訳が開始 続編に期待

Firefox 52で有効化された新機能の1つにWebAssemblyがある。WebAssembly のコンセプト - WebAssembly | MDNの冒頭では、その内容を次のように説明している。

WebAssembly はモダンなウェブブラウザで動作して新たな機能と大幅なパフォーマンス向上を提供する新しい種類のコードです。基本的に直接記述ではなく、C、C++、Rust 等の低水準の言語にとって効果的なコンパイル対象となるように設計されています。

この機能はウェブプラットフォームにとって大きな意味を持ちます — ウェブ上で動作するクライアントアプリで従来は実現できなかった、ネイティブ水準の速度で複数の言語で記述されたコードをウェブ上で動作させる方法を提供します。

それ以上に、その利点を享受するために利用者は WebAssembly のコードをどのように作成するのか知る必要さえ有りません。 WebAssembly モジュールはウェブ (あるいは Node.js) アプリにインポートする事ができ、WebAssembly の機能は JavaScript を経由して他の領域から利用できる状態になります。JavaScript 製フレームワークでは大幅なパフォーマンス改善と開発中の新機能をウェブ開発者が容易に利用できるようにするために WebAssembly を用いることができます。

上記コンセプト記事内には、他にも「WebAssemblyの目標」、「WebAssemblyはどのようにウェブプラットフォームに適合するのか?」、「WebAssemblyをどのようにアプリで用いるか?」といった項目が立てられ、WebAssemblyの概要が的確にまとめられている。ただ、このテーマに関する情報を以前から追いかけてきたならともかく、ふつうのWeb開発者がこの記事を読むと、もう少し背景について掘り下げてほしいと感じるのではないか。

そうした要望に応えるように、2017年2月末、WebAssemblyの概略を紹介する連載記事がMozilla Hacksに掲載された。その内容は充実しており、わかりやすい。だが、6本ある記事はいずれも英語で書かれており、これまで国内でもWebを高速にするアセンブラ技術の今と将来 | マイナビニュースFirefox, Chrome, SafariがCSS Gridに一斉対応ほか──2017年2月と3月のブラウザ関連ニュース | HTML5Experts.jpで言及されたものの、反響は大きくなかった。

広く読まれるためには、やはり和訳が必要だ。とはいえ、内容が内容だけに、正確な和訳には英語力に加えて相当量の知識が求められる。記事が掲載されてから2か月近くが経過しても動きが見られず、このまま話題に上らなくなってしまうのかと思われた。

そこへ颯爽と登場したのが、WebAssembly の漫画での紹介 | Mozilla Developer Street (modest)である。GWに掲載されたこの記事は、連載の第1弾である"A cartoon intro to WebAssembly"を、T.Ukegawa氏が和訳したもの。連載の中ではいわば導入部分にあたり、WebAssemblyがブラウザで有効化されることによって、2008年にJITコンパイラが登場して以来、久々にJavaScriptのパフォーマンスが大きく向上するフェーズに入るとする。

たぶん今後も連載記事が和訳されていくはずだ。そう信じて、以下、残る5つの記事のさわりだけ紹介しておく。

連載の第2弾は、"A crash course in just-in-time (JIT) compilers"である。WebAssemblyの前史であるJavaScriptインタープリタとJITコンパイラのおさらいから始め、コンパイラによる最適化処理の内容をかいつまんで教えてくれる。その際、stubやbailing outといった概念に触れている点も評価できる。

連載の第3弾となる"A crash course in assembly"でも、まだWebAssembly自体は出てこない。機械語とアセンブラ、さらに中間表現(IR)について、図を交えながら説明している。

連載の第4弾、"Creating and working with WebAssembly modules"に至って、話は一挙に核心に迫る。LLVM(コンパイラ基盤)のIRからWebAssemblyへの変換や、コードの動作、モジュールの構造など扱う内容は多岐にわたり、読み応えがある。

連載の第5弾、"What makes WebAssembly fast?"は、WebAssemblyの速度に焦点を当てる。通常のJavaScriptよりも高速に処理される理由を、Fetching・Parsing・Compiling + optimizing・Reoptimizing・Executing・Garbage collectionの各場面に分けて解説している。第4弾および第5弾のディープな内容は、第3弾までの丁寧な説明があってこそだろう。

連載の最後を飾る第6弾が"Where is WebAssembly now and what’s next?"。WebAssemblyは2017年2月28日にブラウザプレビューの段階を脱し、大手ブラウザはそろって有効化に向けて動いた。今後、パフォーマンスの面ではJavaScriptとの間のファンクションコールを高速化し、WebAssembly自体の読み込み速度や実行速度も改善していく。また、仕様の面ではDOMを直接操作可能にし、並列処理を進め、例外処理のハンドリングを行えるようにする。

(17/05/13追記)
連載第2弾の和訳として、ジャスト・イン・タイム (JIT) コンパイラの短期集中コース | Mozilla Developer Street (modest)が公開されている。

(17/05/22追記)
連載第3弾の和訳として、WebAssembly の短期集中コース | Mozilla Developer Street (modest)が公開されている。

(17/10/02追記)
連載第4弾の和訳として、WebAssembly モジュールの作成と操作 | Mozilla Developer Street (modest)が、連載第5弾の和訳として、WebAssembly を速くするには? | Mozilla Developer Street (modest)が、それぞれ公開されている。