What is WebAssembly (Wasm)?
WebAssembly (Wasm) is a binary instruction format designed as a portable compilation target for high-performance applications, enabling code written in languages like C, C++, and Rust to run on the web at near-native speed alongside JavaScript.
WebAssembly (often abbreviated as Wasm) is a low-level, assembly-like language that runs in modern web browsers. It was created to solve the performance limitations of JavaScript for compute-intensive workloads like games, video editing, 3D rendering, and scientific simulations. Unlike JavaScript, which is text-based and must be parsed and JIT-compiled, WebAssembly is delivered in a compact binary format that can be decoded and compiled extremely quickly, with predictable performance characteristics closer to native machine code.
- 1
Binary format: Wasm uses a compact binary encoding (.wasm files) that is smaller than equivalent JavaScript, reducing download and parsing time .
- 2
Stack-based virtual machine: The Wasm runtime uses a stack machine architecture where instructions pop arguments from and push results onto an operand stack .
- 3
Type-safe and memory-safe: Wasm runs in a sandboxed environment with strong type checking and memory safety guarantees, preventing common vulnerabilities like buffer overflows .
- 4
Linear memory: Wasm modules have access to a contiguous array of bytes called linear memory, which can be shared with JavaScript via ArrayBuffer .
- 5
Near-native performance: Because Wasm is designed to be compiled to machine code ahead of time (AOT) or with efficient JIT, it can execute at 80-90% of native speed, compared to JavaScript's typical 20-50% .
- 6
Language agnostic: Wasm is a compilation target, not a language you write directly. Languages like C, C++, Rust, Go, and many others can compile to Wasm .
WebAssembly is designed to complement JavaScript, not replace it. JavaScript remains the language for UI, interactivity, and dynamic behavior, while Wasm handles heavy lifting. The two can seamlessly interoperate—JavaScript can call Wasm functions with near-zero overhead, and Wasm can call JavaScript functions. This allows developers to gradually migrate performance-critical parts of an application to Wasm while keeping the rest in JavaScript.
- 1
Download: Browser fetches the .wasm binary file (typically 10-20% smaller than gzipped JavaScript) .
- 2
Decoding: Wasm binary is decoded into an intermediate representation. This is much faster than JavaScript parsing because the format is designed for efficient decoding .
- 3
Validation: The module is validated for type safety, memory safety, and control flow integrity to ensure it can't break the browser sandbox .
- 4
Compilation: The browser compiles Wasm to machine code. This can happen ahead-of-time (during download), just-in-time, or even streamingly as the binary arrives .
- 5
Instantiation: A WebAssembly module is instantiated with its import dependencies (like JavaScript functions) and linear memory is allocated .
- 6
Execution: Compiled machine code executes with performance close to native, with predictable memory access patterns .
The performance story is compelling: Figma redesigned their entire rendering engine in C++ and compiled to Wasm, achieving 3x faster load times and smoother interaction compared to their previous JavaScript implementation . AutoCAD moved their 30-year-old C++ codebase to the web via Wasm, running complex CAD operations in the browser . Google Earth, Unity, and many game engines now use Wasm to deliver desktop-class experiences on the web.
- 1
Node.js: Wasm modules can be loaded and used in Node.js for CPU-intensive server-side tasks like image processing, video encoding, or machine learning inference .
- 2
WASI (WebAssembly System Interface): A standardization effort to provide system-level access (files, sockets, clocks) to Wasm modules outside the browser .
- 3
Edge computing: Cloudflare Workers, Fastly Compute, and other edge platforms support Wasm for running customer code safely and efficiently at the edge .
- 4
Plugin systems: Applications like Envoy proxy use Wasm for extensible plugin architectures where plugins run safely in a sandbox .
- 5
Blockchain: Smart contracts on blockchains like Ethereum (eWasm) and Polkadot use Wasm as their execution engine .
WebAssembly represents a fundamental shift in web platform capabilities. For the first time, developers can use languages other than JavaScript to build web applications, and existing C++ codebases can be ported to the web without rewriting. The binary format ensures efficient delivery, while the sandboxed execution maintains security. With features like threads, SIMD, and garbage collection coming or already available, Wasm continues to evolve toward being a true universal compilation target for all platforms.
Scenario Questions
0-2 years experience
- 1How would you load a .wasm file in a web page and call an exported function from JavaScript?
- 2If the fetch for the Wasm module fails, what fallback strategy could you implement in the UI?
- 3What happens if you pass a JavaScript number to an exported Wasm function that expects an i32?
2-5 years experience
- 1You need to add a performance‑critical image processing routine written in Rust to an existing React app. Walk me through how you'd integrate the compiled Wasm module and the trade‑offs you’d consider.
- 2During testing the Wasm module crashes when given a large array. How would you approach debugging this issue?
- 3Explain why a recent change to the module’s memory allocation caused the JavaScript UI to freeze, and how you’d fix it.
5-8 years experience
- 1Design a system where multiple micro‑frontends share a common Wasm runtime for heavy computations. What architectural concerns arise regarding memory, versioning, and security?
- 2How would you handle progressive loading of Wasm modules in a low‑bandwidth environment while ensuring type safety?
- 3Discuss the impact of using Wasm threads (shared memory) on the main thread’s event loop and how you’d mitigate contention.
8+ years experience
- 1Your organization plans to replace a legacy C++ library with a Wasm‑based service consumed by both web and native clients. Propose a migration strategy that minimizes risk and maintains backward compatibility.
- 2At scale, how would you manage Wasm module versioning, caching, and CDN distribution across multiple data centers while ensuring consistent performance?
- 3Security audits now require sandboxing of third‑party Wasm code. How would you design a policy framework and runtime enforcement that works across teams?
Follow-up Questions
- Which toolchain would you choose to compile your code to Wasm and why?
- How does Wasm’s sandbox differ from the JavaScript sandbox?
- What are the main limitations you’ve hit when using Wasm in production?