2020-07-30
webアプリのサイズ、小さいほど読み込みが早くて快適に!
Zen言語でシンプルな WebAssembly、動かしてみました。(src on GitHub)


C言語以上に細部に手が届く、軽量静的型付け言語の「Zen言語」は、WebAssembly出力にも対応。 下記、たった3行、誰にでも分かりやすい足し算するだけのプログラムを「zen build」でコンパイルするだけ、HTML/JavaScriptから呼び出して、利用できます。(src on GitHub)

export fn add(a: i32, b: i32) i32 { return a + b; }

(プログラム解説)
export → 外部から使うよ
fn → function 関数だよ
add → 関数名はaddにしよう
a: i32 → 符号付き整数32bitのパラーメータaが関数addの引数1つ目
b: i32 → 符号付き整数32bitのパラーメータbが関数addの引数2つ目
i32 → 符号付き整数32bitを関数の値として返すよ
return a + b; → パラメータaとbを足したものを返すプログラム、終端記号は「;」セミコロン

コンパイルしてできあがった、main.wasm ファイルは、たった115byte。
下記のようにHTML内のJavaScriptでつないで、HTTPサーバーを立ててブラウザで開けば動きます!(ローカルファイルからは動きません)

<script type="module"> (async () => { const bin = await (await fetch("./main.wasm")).arrayBuffer(); const wasm = await WebAssembly.instantiate(bin); const ex = wasm.instance.exports; const add = ex.add; document.body.textContent = "WebAssembly in Zen, add(1,2) = " + add(1, 2); })(); </script>

簡単ですね!

別途 wasm-strip を使ったビルドコマンド「zen build strip」を使うと、72byteまで縮みます。

ランタイムがなく、追加容量なしでプログラムを分かりやすく整理できる(抽象化)Zen言語。
大規模Webアプリ開発にも使える予感!何かのアプリで実証してみたくなりますね!

links
- Zen言語で LPC810 Arm組み込み開発、Zenbedded!
- 言語づくりという解決手段、高速安全コンパクトなZen言語で簡単組み込み開発 on IchigoJam with zen4ij
- RustではじめるWebAssemblyはじめのいっぽ、足し算するwasmファイルは116byte
- IchigoJam BASIC on the web by WebAssembly

Tweet
クリエイティブ・コモンズ・ライセンス
本ブログの記事や写真は「Creative Commons — CC BY 4.0」の下に提供します。記事内で紹介するプログラムや作品は、それぞれに記載されたライセンスを参照ください。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / 「一日一創」画像 / RSS