Rust+WebAssemblyでライフゲームを実装する：Wasm最適化テクニックとデスクトップ壁紙化ガイド

# Rustのインストール（未インストールの場合）
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

# wasm-packのインストール
cargo install wasm-pack

# wasm32ターゲットの追加
rustup target add wasm32-unknown-unknown

# プロジェクトの作成
cargo new --lib wasm-lifegame
cd wasm-lifegame

[package]
name = "wasm-lifegame"
version = "0.1.0"
edition = "2021"

[lib]
crate-type = ["cdylib", "rlib"]

[dependencies]
wasm-bindgen = "0.2"
js-sys = "0.3"
web-sys = { version = "0.3", features = ["console"] }

[profile.release]
opt-level = 3
lto = true

use wasm_bindgen::prelude::*;

#[wasm_bindgen]
pub struct Universe {
    width: u32,
    height: u32,
    cells: Vec<u8>,
}

#[wasm_bindgen]
impl Universe {
    pub fn new(width: u32, height: u32) -> Universe {
        let cells = (0..width * height)
            .map(|i| if i % 2 == 0 || i % 7 == 0 { 1 } else { 0 })
            .collect();

        Universe { width, height, cells }
    }

    pub fn tick(&mut self) {
        let mut next = self.cells.clone();

        for row in 0..self.height {
            for col in 0..self.width {
                let idx = self.get_index(row, col);
                let cell = self.cells[idx];
                let live_neighbors = self.live_neighbor_count(row, col);

                next[idx] = match (cell, live_neighbors) {
                    (1, x) if x < 2 => 0,
                    (1, 2) | (1, 3) => 1,
                    (1, x) if x > 3 => 0,
                    (0, 3) => 1,
                    (otherwise, _) => otherwise,
                };
            }
        }
        self.cells = next;
    }

    // セル配列へのポインタを返す（ゼロコピー用）
    pub fn cells_ptr(&self) -> *const u8 {
        self.cells.as_ptr()
    }

    pub fn width(&self) -> u32 { self.width }
    pub fn height(&self) -> u32 { self.height }

    fn get_index(&self, row: u32, column: u32) -> usize {
        (row * self.width + column) as usize
    }

    fn live_neighbor_count(&self, row: u32, column: u32) -> u8 {
        let mut count = 0;
        for delta_row in [self.height - 1, 0, 1].iter().cloned() {
            for delta_col in [self.width - 1, 0, 1].iter().cloned() {
                if delta_row == 0 && delta_col == 0 { continue; }
                let neighbor_row = (row + delta_row) % self.height;
                let neighbor_col = (column + delta_col) % self.width;
                let idx = self.get_index(neighbor_row, neighbor_col);
                count += self.cells[idx];
            }
        }
        count
    }
}

// ❌ 毎フレームコピーが発生する方法
const cells = universe.get_cells(); // 配列コピーが発生

import { Universe } from "wasm-lifegame";
import { memory } from "wasm-lifegame/wasm_lifegame_bg.wasm";

const universe = Universe.new(1000, 1000);

// Wasmのリニアメモリを直接参照（ゼロコピー）
const cellsPtr = universe.cells_ptr();
const cells = new Uint8Array(
  memory.buffer,
  cellsPtr,
  universe.width() * universe.height()
);

function renderLoop() {
  universe.tick();

  // cellsは自動的に最新の状態を反映（同じメモリを参照）
  drawCells(cells);

  requestAnimationFrame(renderLoop);
}

// フォーカスが外れたらフレームレートを下げる
document.addEventListener('visibilitychange', () => {
  if (document.hidden) {
    // 非アクティブ時は15fpsに制限
    setTimeout(renderLoop, 66);
  } else {
    requestAnimationFrame(renderLoop);
  }
});