Simple benchmark comparing performance of JavaScript vs. WebAssembly modules generated by different compilers.

LIVE DEMO

This is a simulation of the wave equation ∂²u/∂t² = c²(∂²u/∂x²+∂²u/∂y²) across a 2D manifold with a boundary condition of u=0 along the unit circle. Use the mouse to create waves.

It contains 5 implementations of the same code:

• Standard JavaScript
• C code compiled by Clang/Binaryen (WebAssembly Studio)
• C code compiled by Enscripten
• JS-like code compiled by Walt to WebAssembly
• TypeScript-like code compiled by AssemblyScript to WebAssembly

This particular algorithm processes large arrays but does no floating point calculations. Memory is visible to bot JS and WebAssembly and almost all CPU time is spent in the algorithm itself. (The canvas API introduces a minor overhead of about 10%.)

There are two options for generating the .wasm file:

• C: In directory emscripten compile emscripten.c with Emscripten: emcc emscripten.c -Os -s WASM=1 -s SIDE_MODULE=1 -o emscripten.wasm
• Walt: In directory walt run npm install and npm run build to compile waves.walt to a waves.wasm file.
• AssemblyScript: In directory as run npm install and npm run asbuild to compile index.ts to wasm files.

• test.html loads the JS and .wasm modules, tests them on a 5x5 grid, and and displays the results.

• Directory online_versions has copies of older versions on online IDEs.

  • webassembly_studio has a version comparing JS and C, available at WebAssembly Studio
  • codepen has an older version with .wasm bundled inline as a base64 string. (Codepen isn't as useful for benchmarking since it mangles JS but not WebAssembly.)

Jason Tiscione

This project is licensed under the MIT License.