WebAssembly を使ったサーバレス開発の基礎と実践 (ServerlessDays Tokyo 2024 配布用資料)


## 用語解説

---
## WebAssembly
- スタックベースの仮想マシン用のバイナリ命令フォーマット
  * しばしば拡張子が .wasm であるバイナリファイルのことを指す
  * それ自体は実行ファイルではなく、Wasmランタイムに読み込ませて動作する
    * ランタイムの例：主要なブラウザ、**_Wasmtime_** など
- WebAssembly が使われているケース
  * ブラウザ上: Figma, Photoshop, Unity, Google Meet etc
  * ブラウザ外(**_Wasi_**): エッジコンピューティング, コンテナ, IoT etc
- 参考リンク
  * https://www.w3.org/groups/wg/wasm/

---
## WebAssembly 略歴
- 2012-2013年頃、Emscripten や asm.js といったブラウザ上でアプリケーションを高速に動作させる手法が開発され注目を集める
- 2015年 Mozilla や Chromium, Edge, WebKit の開発者が W3C コミュニティグループとして WebAssembly の開発開始を発表
- 2016年 主要なブラウザが実験的なサポートを開始
- 2019年 W3C 勧告が策定
- 〜2024年現在 ブラウザ内外の様々なシーンで利用が広がっている

---
## Wasi

- WebAssembly System Interface
- システムの各種リソースへのインターフェースを定義
  * 例: File System, Network
- W3C WebAssebmly CG のサブグループとして活動
- https://wasi.dev/


---
## 例)ビルドターゲットに WebAssembly を指定してコンパイル

```bash
$ cat main.rs
fn main() {
  println!("Hello");
}
$ rustc main.rs --target wasm32-wasi
$ ls
main.rs main.wasm
```

---
## Wasmtime とは

- WebAssembly, WASI, Component Model のためのスタンドアロンのランタイム
  * **_Bytecode Alliance_** が開発
  * リリースログなど確認できる限り開発開始は 5 年以上前([ソース](https://hacks.mozilla.org/2019/12/using-webassembly-from-dotnet-with-wasmtime/))
  * それ以降 2020 年に、同じく Wasm ランタイムの一つで Fastly が開発してオープンソース化した Lucet の開発チームが合流し、現在も活発な開発が続いている
    * 例) 2週間ほど前の BA の記事 ["New Stack Maps for Wasmtime and Cranelift"](https://bytecodealliance.org/articles/new-stack-maps-for-wasmtime)

---
## Wasmtime の特徴
- 多機能
  * ランタイムとしての機能が有名
    * `wasmtime`コマンド、または各言語からの呼び出し
  * Wasm バイナリの JIT/AOT コンパイラである **_Cranelift_** も同梱
  * `wasmtime serve` コマンドで wasi-http の実装も使える
  * [デバッガをアタッチ](https://docs.wasmtime.dev/examples-debugging.html)したり[プロファイラでパフォーマンス測定](https://docs.wasmtime.dev/examples-profiling.html)したりもできる
- 参考リンク
  * [github.com/bytecodealliance/wasmtime](https://github.com/bytecodealliance/wasmtime) Cranelift のソースも見れる
  * [Guide for C and Rust programmers | Fastly](https://www.fastly.com/blog/webassembly-memory-management-guide-for-c-rust-programmers/) Cranelift の最適化動作イメージ図
  * https://bytecodealliance.org/
    * ここまでの用語がわかると [Zulipchat](https://bytecodealliance.zulipchat.com/) の話が少し読みやすくなるはず


---
## 例) Wasmtime を利用した Wasm module の実行

```bash
#$ cat main.rs
#fn main() {
#  println!("Hello");
#}
#$ rustc main.rs --target wasm32-wasi
#$ ls
#main.rs main.wasm
$ wasmtime main.wasm
Hello
$ wasmtime compile main.wasm
$ ls
main.cwasm main.rs main.wasm
$ WASMTIME_NEW_CLI=0 wasmtime main.cwasm --allow-precompiled
Hello
$ wasmtime explore main.wasm 
Exploration written to main.explore.html
```

---
## Wasmtime の性能

- 高速起動
  * JS 実行エンジン(SpiderMonkey)の Wasm Module を5マイクロ秒で起動（[2022年9月のBAのブログ記事](https://bytecodealliance.org/articles/wasmtime-10-performance#fast-instantiation-results)より引用）
- 安全性
  * メモリ安全なRustの採用、各種サプライチェーン安全性への対応、徹底的で執拗なファジング、形式的検証やスペクトル対策などによりセキュリティ対策を強化（[2022年9月のBAのブログ記事](https://bytecodealliance.org/articles/security-and-correctness-in-wasmtime)より引用）

> (余談/閑話休題) 上記のような Wasm ランタイムの最適化のほかに、Wasm module (バイトコード) 自体の最適化を行う [wizer](https://github.com/bytecodealliance/wizer) や [weval](https://github.com/bytecodealliance/weval) といったプロジェクトもあり、最適化は様々な方向性で実施されている。 ※どちらも Bytecode Alliance のプロジェクト


---
## WebAssembly x サーバレス開発

---
## Wasi の種類
- Wasi 0.1(p1): 枯れてる仕様。`Viceroy` などで利用
- Wasi 0.2: 今年1月にローンチ。Component Model に基づく仕様、`wasmtime serve`などで利用

---
## Wasi の動作環境
- WebAssemblyをセルフホスト
  * オンプレでもマネージドな一般的なサーバレス環境でも
  * 例) コンテナのファイルシステムの中に Wasm ランタイムと Wasm module (.wasmファイル)を格納して実行 [1]
- WebAssemblyに特化したサーバレスマネージド環境で動作(Fastly Compute, Fermyon等)
> [1] (脱線/閑話休題) 先月発表された Wasi 0.2.1 で Wasm Component を Warg だけでなく OCI準拠のコンテナレジストリ(e.g.  GitHub Packages, Azure Container Registry, Google Artifact Registry) に fetch/publish などできる仕様が策定完了([ソース](https://bytecodealliance.org/articles/WASI-0.2.1#wasi-interfaces-are-now-available-as-oci-images))


---
## Fastly Compute の特徴
(詳細は講演資料で紹介、ここでは概要と要約のみ)

- グローバルで約100拠点ある各POP上のサーバで実行される Wasm バイナリをデプロイ可能
  * VCL では扱えなかった HTTP Req/Res Body の操作含めて汎用言語で操作可能に
- Rust, Go, JavaScript で開発可能(公式サポート)
  * 非公式 SDK を自作することも可能 (例: Zig, Swift, Ruby, C#)
- 開発の始め方や SDK の基本的な紹介は[ここ](https://qiita.com/remore/items/9d8a69c34a8655e37ac6#%E7%9B%AE%E6%AC%A1)
- 主な各種リソース制限は[ここ](https://www.fastly.com/documentation/guides/compute/#limitations-and-constraints)
  * 100 MBのパッケージまでアップロード可能、130 sec / process、メモリ消費 128 MB まで等
- コードの公式サンプル（大量）は[ここ](https://www.fastly.com/documentation/solutions/examples/)

---
## Fastly Compute の利用例

- Yamagoya 2023 (日本での年次カンファレンス)
  * スライド: [行動ログ収集 API サーバの Fastly Compute 移行〜高スケーラビリティ、高信頼性、高メンテナンス性を目指して 〜](https://speakerdeck.com/htamakos/xing-dong-rogushou-ji-api-sabano-fastly-compute-yi-xing-gao-sukerabiritei-gao-xin-lai-xing-gao-mentenansuxing-womu-zhi-site)
  * 動画: [パネルディスカッション 前編 「30 分早わかり 4 社の Fastly Compute ユースケース」](https://www.youtube.com/watch?v=AGr-qYNk8jk)
  * 動画: [パネルディスカッション 後編 「Climbers Talk: Fastly Compute の歩き方」](https://www.youtube.com/watch?v=Jy3Rf4_M5jE)
- Altitude 2023 セッション動画
  * 動画: [Only on Fastly with Tyler McMullen](https://www.youtube.com/watch?v=ISZ-gFJEwso)

---
## お知らせ 1

今年6月に無料プランを提供開始([公式ブログ記事](https://www.fastly.com/jp/blog/its-free-instant-and-yours-fastlys-free-developer-accounts-are-here/))
  * CDN 無料枠についてわかりやすく紹介されている [Zenn の記事](https://zenn.dev/kusuke/articles/2c4f49c8b6fe1f#%E5%AE%9F%E3%81%AF%E6%AF%8E%E6%9C%88250gb%E7%9B%B8%E5%BD%93%E3%81%AE%E3%83%88%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%81%8C%E7%84%A1%E6%96%99%E3%82%A2%E3%82%AB%E3%82%A6%E3%83%B3%E3%83%88%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6%E3%82%8B)

---
## お知らせ 2

明日ワークショップがあります;
Fastly と Glitch の無料プランで作るサーバレス開発入門

(ServerlessDays Tokyo参加者用)登録フォーム:
https://forms.gle/FjoqGYVRzkupURJy8