- Use
wasm-bindgenfor JavaScript interop. Usewasm-packfor building and packaging. - Map Rust types to JS with
#[wasm_bindgen]. UseJsValuefor dynamic types, typed wrappers for known types. - Handle errors with
Result<T, JsValue>. Convert Rust errors to descriptive JS error messages. - Support both browser (ES modules) and Node.js (CommonJS/ESM) targets.
- Async: use
wasm-bindgen-futuresfor Promise-returning functions. Never block the main thread. - Bundle size: use
opt-level = "z",lto = true,codegen-units = 1in release profile. - Use
web-sysandjs-sysfor Web API access. Feature-gate platform-specific APIs. - Test with
wasm-pack test --headless --firefoxand a JS test runner (e.g., Vitest or Jest) for JS integration tests. - Generate TypeScript definitions automatically. Keep
.d.tsfiles in sync with Rust exports. - Anti-patterns: no
std::thread(single-threaded), no synchronous I/O, no panics (becomes JS exception).
Wasm Bindings
wasm-bindgen conventions for compiling a Rust core to WebAssembly for JavaScript: wasm-pack packaging, JsValue mapping, async futures, bundle-size tuning, web-sys/js-sys, and TypeScript defs. Load when generating or reviewing WebAssembly/JS bindings for a Rust library.
Wasm Bindings by goldziher · 5b3b956
npx skillmds@latest add goldziher/wasm-bindings File contents
---name: wasm-bindingsdescription: wasm-bindgen conventions for compiling a Rust core to WebAssembly for JavaScript: wasm-pack packaging, JsValue mapping, async futures, bundle-size tuning, web-sys/js-sys, and TypeScript defs. Load when generating or reviewing WebAssembly/JS bindings for a Rust library.---- Use `wasm-bindgen` for JavaScript interop. Use `wasm-pack` for building and packaging.- Map Rust types to JS with `#[wasm_bindgen]`. Use `JsValue` for dynamic types, typed wrappers for known types.- Handle errors with `Result<T, JsValue>`. Convert Rust errors to descriptive JS error messages.- Support both browser (ES modules) and Node.js (CommonJS/ESM) targets.- Async: use `wasm-bindgen-futures` for Promise-returning functions. Never block the main thread.- Bundle size: use `opt-level = "z"`, `lto = true`, `codegen-units = 1` in release profile.- Use `web-sys` and `js-sys` for Web API access. Feature-gate platform-specific APIs.- Test with `wasm-pack test --headless --firefox` and a JS test runner (e.g., Vitest or Jest) for JS integration tests.- Generate TypeScript definitions automatically. Keep `.d.ts` files in sync with Rust exports.- Anti-patterns: no `std::thread` (single-threaded), no synchronous I/O, no panics (becomes JS exception).
goldziher/ai-rulez/tree/main/internal/builtins/bindings/wasm/skills/wasm-bindings commit 5b3b9568fe
Frequently asked questions
Run npx skillmds@latest add goldziher/wasm-bindings in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.
wasm-bindgen conventions for compiling a Rust core to WebAssembly for JavaScript: wasm-pack packaging, JsValue mapping, async futures, bundle-size tuning, web-sys/js-sys, and TypeScript defs. Load when generating or reviewing WebAssembly/JS bindings for a Rust library. It is listed under Coding & Dev Tools on SkillMD.
This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.
This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.
Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.
goldziher (@goldziher) published this skill. Their other Agent Skills are listed on their SkillMD profile.