Michael Bebenita Researcher, Mozilla

1. WebAssembly Tools & Applications
Michael Bebenita - mbebenita@mozilla.com

2. A brief history of WebAssembly
c = a + b
Boolean
Number
String
Object
Boolean
Number
String
Object
Boolean
Number
String
Object

3. A brief history of WebAssembly
c = a + b
Boolean
Number
String
Object
Boolean
Number
String
Object
Boolean
Number
String
Object

4. A brief history of WebAssembly
c = (a | 0) + (b | 0)
Number
(Double)
Number
(Int32)
Number
(Int32)

5. A brief history of WebAssembly
c = ((a | 0) + (b | 0)) | 0
Number
(Int32)
Number
(Int32)
Number
(Int32)

6. A brief history of WebAssembly
function add(a, b) {
a = a | 0
b = b | 0
return a + b | 0
}
int add(int a, int b) {
return a + b
} LLVM > Emscripten
C/C++ JavaScript

7. A brief history of WebAssembly
function add(a, b) {
a = a | 0
b = b | 0
return a + b | 0
}
JS Engine
sub rsp, 8
mov ecx, esi
mov eax, ecx
add eax, edi
add rsp, 8
ret
x86 AssemblyJavaScript

8. A brief history of WebAssembly
“use asm”
function add(a, b) {
a = a | 0
b = b | 0
return a + b | 0
}
JavaScript (asm.js)

9. A brief history of WebAssembly
(func $add
(type $t1)
(param $p0 i32)
(param $p1 i32)
(result i32)
get_local $p1
get_local $p0
i32.add
)
int add(int a, int b) {
return a + b
}
C/C++ WebAssembly
LLVM > Emscripten > Binaryen

10. A brief history of WebAssembly
• asm.js
• Structured Control Flow
• Linear Memory w/ Isolated Stack
• WebAssembly
• Compact Binary Encoding
• New DataTypes & Operators (f32, i64, ..)

11. Emscripten
Primary toolchain for compiling C/C++
to WebAssembly
Compiler (+ Libraries)

12. Binaryen (.js)
Compiler infrastructure and toolchain library for
WebAssembly, in C++
• Shrink LLVM code, ~15%
• Shrink & optimize all other code, ~50%
• Produce reasonable Wasm code, let Binaryen take care of the details for
you.

13. Cranelift
(Formerly Cretonne)
A low-level retargetable code generator, w/ a
WebAssembly Frontend
• WebAssembly engine in Firefox
• Embeddable
• Backend for Rust’s debug builds

14. Rust + WebAssembly
• wasm-bindgen
• wasm-pack
• twiggy

15. Pyodide
The Python scientific stack, compiled to
WebAssembly.

16. https://WebAssembly.Studio

17. Try Before you Buy

20. Downloadable Codecs / Analysis Tools

21. Client Side Signal Processing / ML

22. Thank You