I’ve been seeing a lot of really cool #wasm (WebAssembly) stuff on Twitter and Hacker News lately, but I didn’t know much about what it is exactly, or how to start using it. Because it is so new — only being enabled in Chrome last March — up-to-date guides are few and far between. After struggling through getting something to run, here’s what I’ve learned:

WebAssembly is a cool new binary format and compile target for the web. That means you can compile languages like C, C++, and Rust to .wasm files and execute that code in your browser. In most cases, the resulting code is significantly faster and smaller than Javascript.

This guide will walk you through setting up Rust, WebAssembly, and Webpack in a typical JS web app. The goal is to be able to execute low-level Rust code in the browser alongside the Javascript you know and love (or hate).

Note: These technologies are constantly changing. This guide is using:

webpack 3.0.0

3.0.0 cargo 0.19.0

0.19.0 emcc 1.37.13

Here is the finished project. If you notice something is out-of-date, let me know with an issue or PR 😊.