ドリコムで Web フロントエンド周辺でアレコレしているいっこう(@ikkou)です。
プライベートでは「VR Tech Tokyo」という VR/AR/MR を軸にしたイベントを主催するなどVR クラスタの人として振る舞っていることが多いです。VR ZONE SHINJUKU 楽しみですね。
「VR Tech Tokyo」然り、私は去年末のアドベントカレンダーシーズンに「IT勉強会/コミュニティ運営 Advent Calendar 2016」というカレンダーを立てる程度に「勉強会コミュニティ」を主催したり運営することが好きなのですが、先週 7/5 には「emscripten night !! #4」という Emscripten や WebAssembly をテーマに絞った、少しニッチな勉強会を開催しました。
emscripten night !! とは
emscripten night !! は去年開催された CEDEC 2016 で Tombo Inc. の紀平(@tkihira)さんが登壇された 「EmscriptenやWebAssemblyを使ったWebゲーム開発」というセッションをきっかけにして 2016 年 10 月に立ち上げた勉強会です。
以降 12 月、翌年 2 月と隔月で開催していたのですが、これという大きなトピックも無かったため、しばらくお休みしていた折、6 月に開催された WWDC 2017 で後述する大きな発表があったことを受け、急きょ #4 を企画、開催しました。
Emscripten と asm.js 、そして WebAssembly
Emscripten は Firefox で有名な Mozilla 発の 2012 年に生まれたプロジェクトで、ソースコードは GitHub で公開されています。
kripken/emscripten
平たく言えば C/C++ から JavaScript を生成する「コンパイラ」です。Emscripten それ自体が何かしらのプログラミング言語というわけではなく「変換機構」のような存在です。
この Emscripten で JavaScript そのものを高速に実行させるための仕組みであり JavaScript のサブセットである asm.js を生成することができます。
つまり Emscripten を通して C/C++ で書かれた資産を JavaScript に転用することができます。
Emscripten を使った分かりやすい例のひとつとして、みんな大好きな Vim をブラウザで動くようにした Vim.js があります。ちなみに私は Atom 派です。
そして 2015 年に asm.js の次のステップとなる WebAssembly が発表されました。略称は WASM です。
asm.js が Mozilla 発のプロジェクトだったことに対して、WebAssembly はモバイル OS としての Android とブラウザとしての Chrome を持つ Google、Firefox の Mozilla、Edge の Microsoft、そしてモバイル OS としての iOS とブラウザとしての Safari を持つ Apple という 4 大ブラウザベンダが共同で開発しています。
この WASM はバイナリフォーマットであり、JavaScript の拡張や代替ではありません。
これまでブラウザ上でリッチなアプリケーションを動かすには JavaScript が必要でしたが、ブラウザベンダが足並みを揃えて開発している WASM を使うことで、端的に言ってしまえば JavaScript を気にせずに、そして JavaScript よりも高速で動くアプリケーションを作ることが出来るのです。
まだ 1 度も試したことがない方はぜひ WASM の公式サイトにある Tanks! Demo にアクセスしてみてください。最新版の Chrome であれば WASM に標準対応しているので、Play WebAssembly という緑のボタンが表示されているはずです。
Tanks! はドリコムのゲーム開発にも使用しているゲームエンジン「Unity」のチュートリアル用のゲームで、このチュートリアルをブラウザで動作するように Unity から WASM 出力したものになります。ヌルヌル動くことが確認できるかと思われます。
ちなみに Tanks! の起動直後から急にファンが回り始めたかもしれませんが、WASM の動作には一定のマシンパワーを必要とするため、正常です。
また、ゲームが起動するまでに少し時間が掛かったかもしれませんが、WASM は WASM 出力ではない元の状態と比較すると現時点ではファイルサイズが重くなるので、これも正常です。
まだまだ完璧な代物ではありませんが、ブラウザの可能性を大いに広げるものであることは感じられたのではないでしょうか。
高まる WebAssembly の機運
iOS 11 が WebAssembly に対応
emscripten night !! の話しに戻ります。
前述の通り emscripten night !! は #3 以降しばらくお休みしていたのですが、WWDC 2017 の発表をきっかけに #4 を開催することに決めました。
その発表は待ちに待った、そしてまだもうしばらく先になるだろうと予測していた iOS の WebAssembly 対応でした。
Apple 公式の開発者向けページ What’s New in Safari の Safari 11.0 を見ると、Highlights of Safari 11.0 の項目に確かに WebAssembly の記述があります。
ご存知の方も多いかもしれませんが、WASM は Apple を含む 4 大ブラウザベンダが足並みを揃えて進めてきたプロジェクトにも関わらず、なぜか、あるいはやはり Safari だけは実装されない状態が続いていました。
デスクトップ向け Safari のシェアは決して大きいとは言えませんが、ことモバイルブラウザに限っていれば Android の Chrome または iOS の Safari という「ほぼ」二択となります。
その Safari が WASM に対応しなければ、いくらブラウザで出来る範囲が広くなり、例えば WASM 出力のゲームを開発できるようになったとしても、届けられるユーザー数がだいぶ限られていたのですが、いよいよ Safari が対応したことで、色々と現実味を帯びてきたのではないでしょうか。
もちろん現行の WASM は Android にしろ iOS にしろモバイルで動かすには重すぎるといった課題もあるため、今すぐに WASM でモバイルゲーム開発！ということは難しいかもしれませんが、この領域を追っていくのはアリだというのが持論です。
Unreal Engine 4 が WebAssembly 出力に対応
iOS 11 の WASM 対応に先駆けて「Unity」と双璧をなすと言っても過言ではないゲームエンジン「Unreal Engine 4」が 5 月にリリースしたバージョン 4.16 で WebAssembly 出力に対応しました。
WASM のデモ、と言うよりも WebGL 出力と言うと何かと Unity が一歩先を進んでいましたが、ついに UE4 も対応したということで、ゲームエンジンを利用した、いわゆる PC ゲームと遜色のない WebGL 出力のゲームが当たり前になる未来も近付いてきた感があります。
再び emscripten night !! の話
emscripten night !! #4 では、@chikoski さんによる周辺技術の概況を伝える 30 分間セッションの他、3 人の登壇者による 15 分間ずつのショートトークが繰り広げられました。
@chikoski さんには emscripten night !! 初回からロングセッションを務めて頂いていて、先の Unite 2017 でも「WebGL：ゲームプラットフォームとしてのWebと現在と未来」というタイトルで WebAssembly をテーマにして登壇されています。
WASM の現状を知る良い資料なので必見です！
ショートトーク 1 人目の @ueshita さんは「EmscriptenのOpenGLと純粋なWebGLと共存させる黒魔術」と題して OpenGL と WebGL を共存させる、文字通りの「黒魔術」について語っていました。
ショートトーク 2 人目は、あの Unity 勢なら誰でも知っているであろうテラシュールブログの @tsubaki_t1 さんによる Unity の WASM 対応の話しが、そして 3 人目には UE4 の中の人である @pafuhana1213 さんによる UE4 の WASM 対応の話しが繰り広げられ、Unity と UE4 両エンジンの立ち位置から WASM の今に触れる大変貴重な会となりました。
本編の後は、Emscripten と WASM を肴に懇親会が行われ、宴もたけなわというタイミングで始まった飛び込み LT では、残っていた参加者全員でちょっとした議論をするアツい場となりました。
ニッチで狭いジャンルの勉強会という特性上、参加者数は決して多くありませんが、それ故にとても濃い面子が集う場となっているのが emscripten night !! の特長です。
当日のログは togetter にまとまっているので、Emscripten、WebAssembly に興味をお持ちの方はぜひ覗いてみてください。
今日現在、次回の開催日程は未定ですが、夏が終わる頃から秋口にかけて #5 を開催したいと目論んでいます！
