Wasm素振りの記：『Rustで学ぶWebAssembly』3章でHello world。環境構築めっちゃ簡単なんですね！

はじめに

モバミさん、お誕生日おめでとうございます。 nikkieです。

ずっと気になっていたWasmをRustで素振りして、Hello worldしました。

2024/12/06 chikoskiさんに聞く！Wasm最新事情

「Wasm興味あるし、Findyさんのお昼の勉強会覗いてみるか〜」と気軽に立ち寄った私

『Rustで学ぶWebAssembly』の著者chikoskiさんから1時間のお話が聞けました。

WebAssembly (Wasm) の最新事情やRustを用いたWasm開発の魅力についてお話しいただきます。

その中でWasmの使い出しはめちゃめちゃ簡単そうと分かり、書籍に沿って素振りしました。

3.1〜3.3の内容です。

環境構築

書籍の「はじめに」に従います。

手始めに rustup update¹

% rustup --version
rustup 1.27.1 (54dd3d00f 2024-04-24)
% rustc --version
rustc 1.83.0 (90b35a623 2024-11-26)
% cargo --version
cargo 1.83.0 (5ffbef321 2024-10-29)

Wasm向けのビルドターゲットを追加します。
ここが勉強会で簡単と知り、やってみたくなったポイントです

% rustup target add wasm32-unknown-unknown
% rustup target add wasm32-wasip1

環境の確認

% rustup target list | grep wasm32
wasm32-unknown-emscripten
wasm32-unknown-unknown (installed)
wasm32-wasi
wasm32-wasip1 (installed)
wasm32-wasip1-threads
wasm32-wasip2

3章に沿ってツールをインストールします。
ここが一番時間がかかったかもしれません

% cargo install cargo-component
% cargo install wasmtime-cli

% cargo component --version
cargo-component-component 0.19.0
% wasmtime --version
wasmtime 27.0.0

Hello world

% cargo component new hello-wasi-cli

おそらくコードはこちら
https://github.com/chikoski/wasm-component-rust-snippets/tree/3be69605b1e5a8655ddedf9e34e2d16987d7c86a/hello-wasi-cli

cargoが作ってくれます（ここがちょっと紙面と違うような²）

// src/main.rs
fn main() {
    println!("Hello, world!");
}

Wasmをビルド！（人生初）

% cd hello-wasi-cli
% cargo component build

% wasmtime target/wasm32-wasip1/debug/hello-wasi-cli.wasm 
Hello, world!

実行できました‼️‼️‼️‼️‼️‼️‼️❗️

Ferris say

cow sayならぬFerris say。
Rustのカニさん（Ferris）が物申します³

https://crates.io/crates/ferris-says

% cargo add ferris-says

use ferris_says::say;

fn main() {
    let out = "Hello, world!";
    let width = 80;
    let mut writer = std::io::stdout();

    if let Err(e) = say(out, width, &mut writer) {
        println!("{e}");
    }
}

% cargo component build
% wasmtime target/wasm32-wasip1/debug/hello-wasi-cli.wasm

 _______________
< Hello, world! >
 ---------------
        \
         \
            _~^~^~_
        \) /  o o  \ (/
          '_   -   _'
          / '-----' \

ｶﾆｻﾝ､ｼｬﾍﾞｯﾀｱｱｱｱ

終わりに

WasmをRustで素振りしました。
Hello worldしかしていませんが、環境構築がとっても簡単！

今回のコードはこちらです

P.S. 新宿御苑.wasmの予習でもありました

Rustの開発環境自体はすでにありました ↩
mod bindings;はいらないのかな？（付けると「file not found for module bindings」）↩
リポジトリに雰囲気が近いところを見つけました https://github.com/chikoski/wasm-component-rust-snippets/tree/3be69605b1e5a8655ddedf9e34e2d16987d7c86a/component-composition/formatter ↩

nikkie-ftnextの日記

イベントレポートや読書メモを発信