Emscriptenをやってみた

 プログラム
 公開日:2014年12月16日 / 更新日:2014年12月18日

★2014年12月18日追記。
「JPEGの半分サイズ」は正確でないようです。
こちらで検証されてます。

先日、
JPEGの半分サイズで同品質という新しい画像形式「BPG」
という記事に興味を持ちました。
HTMLのimgタグで拡張子bpgが扱えるようになってたので、
どうやってるんだろと思って
ちょっと中身を見てみたところ、
document.imagesを走査して、拡張子がbpgだったら
Canvasオブジェクトを作って、JavaScriptで描画するようになってました。
で、そのJavaScriptはEmscriptenで変換されたものでした。

Emscriptenというのは、ざっくり言うと
C/C++ —> LLVM —> JavaScript
という感じに変換するコンパイラな感じ。
C/C++で書かれたものがJavaScriptに変換されて
Webで利用できてしまうというのがナイスです。

ちなみに、
当ブログの「three.jsで遊んでみる」では
物理エンジンとしてammo.jsというのを利用していますが、
これはBulletというC++で書かれたのが変換されたものだったりします。

そんなわけでEmscriptenって何かスゲーとあらためて感じたので、
実際にちょっと試してみた次第です。
clangとかNode.jsとか必要になるらしいので、
unix系な環境でないと動かないのかなと思ってたら、
Windows向けのSDKとかあるのでこれを使えばよさそうです。

というわけで、こちらからSDKをダウンロードします。
「Emscripten SDK Web Installer」というのを選べばOKだと思います。
あとは普通にインストールするだけ。
clangとかNode.jsとか入れてくれます。

初回インストール時には必要ないと思いますが、
最新版に更新する際は、インストールしたフォルダにおいて
コマンドラインから以下のように入力すればよいようです。
> emsdk update
> emsdk install latest
> emsdk activate latest

Tutorialにしたがって、定番の hello_world.cを変換してみます。
ちなみに中身は以下の通り。

emscriptenのフォルダに移動して、
コマンドラインから以下のように入力します。
> emcc tests/hello_world.c
そうすると、 a.out.jsというファイルが出来るので、
> node a.out.js
と入力して実行すると「hello,world!」と表示されます。

数行のコードがどのようにJavaScriptに変換されているんだろうと思って、
a.out.js の中身を見てみると・・・なんかスゴイことになってます。
行数が約1万、ファイルサイズが357KBくらいあります・・・(^_^;)
大部分は実行するのに必要なお膳立てな部分なようで、
本体は _main となっている所のようです。

なるほど、それっぽく変換されてるけど、
機械的に変換されるので
人間にとっての可読性は期待しない方が良さそうです(^_^;)

ちなみに「公開時に推奨」となっている
最適化オプション -O2 を付けて変換すると、
> emcc -O2 tests/hello_world.c
ファイルサイズが149KBくらいまで小さくなります。
人間にとってはさらに可読困難になりますが(^_^;)

コメント投稿