WebAssembly for Developers (web… or not) Horacio Gonzalez @LostInBrittany
GDG Lille
Slide 2
Horacio Gonzalez @LostInBrittany Spaniard lost in Brittany, developer, dreamer and all-around geek
GDG Lille
Slide 3
OVHcloud: A Global Leader 250k Private cloud VMs running
1
Dedicated IaaS Europe
30 Datacenters
Own 20Tbps
Hosting capacity : 1.3M Physical Servers 360k Servers already deployed
GDG Lille
Netwok with 35 PoPs
1.3M Customers in 138 Countries
Slide 4
OVHcloud: Our solutions Cloud
GDG Lille
Web Hosting
Mobile Hosting
Telecom
VPS
Containers ▪ Dedicated Server
Domain names
VoIP
Public Cloud
Compute ▪ Data Storage
Email
SMS/Fax
Private Cloud
▪ Network and Database
CDN
Virtual desktop
Serveur dédié
Security Object Storage
Web hosting
Cloud HubiC Over theBox
▪ Licences
Cloud Desktop
Securities
MS Office
Hybrid Cloud
Messaging
MS solutions
Slide 5
Did I say WebAssembly? WASM for the friends…
GDG Lille
Slide 6
WebAssembly, what’s that?
Let’s try to answer those (and other) questions… GDG Lille
Slide 7
A low-level binary format for the web
Not a programming language A compilation target GDG Lille
Slide 8
That runs on a stack-based virtual machine
A portable binary format that runs on all modern browsers… but also on NodeJS! GDG Lille
Slide 9
With several key advantages
GDG Lille
Slide 10
But above all…
WebAssembly is not meant to replace JavaScript GDG Lille
Slide 11
Who is using WebAssembly today?
And many more others… GDG Lille
Slide 12
A bit of history Remembering the past to better understand the present
GDG Lille
Slide 13
Executing other languages in the browser
A long story, with many failures… GDG Lille
Slide 14
2012 - From C to JS: enter emscripten
Passing by LLVM pivot GDG Lille
Slide 15
Wait, dude! What’s LLVM?
A set of compiler and toolchain technologies GDG Lille
Slide 16
2013 - Generated JS is slow…
Let’s use only a strict subset of JS: asm.js Only features adapted to AOT optimization GDG Lille
Slide 17
WebAssembly project
Joint effort GDG Lille
Slide 18
Hello W(ASM)orld My first WebAssembly program
GDG Lille
Slide 19
Do you remember your 101 C course?
A simple HelloWorld in C GDG Lille
Slide 20
We compile it with emscripten
GDG Lille
Slide 21
We get a .wasm file…
Binary file, in the binary WASM format GDG Lille
Slide 22
We also get a .js file…
Wrapping the WASM GDG Lille
Slide 23
And a .html file
To quickly execute in the browser our WASM GDG Lille
Slide 24
And in a more Real WorldTM case? A simple process: ● Write or use existing code ○
In C, C++, Rust, Go, AssemblyScript…
● Compile ○
Get a binary .wasm file
● Include ○
The .wasm file into a project
● Instantiate ○ GDG Lille
Async JavaScript retrieving and instantiating the .wasm binary
Slide 25
I think I need a real example now
Let’s use WASM Explorer https://mbebenita.github.io/WasmExplorer/ GDG Lille
Slide 26
Let’s begin with the a simple function
WAT: WebAssembly Text Format Human readable version of the .wasm binary GDG Lille
Slide 27
Download the binary .wasm file
Now we need to call it from JS… GDG Lille
Slide 28
Instantiating the WASM 1. Get the .wasm binary file into an array buffer 2. Compile the bytes into a WebAssembly module 3. Instantiate the WebAssembly module
GDG Lille
Slide 29
Instantiating the WASM
GDG Lille
Slide 30
Loading the squarer function
We instantiate the WASM by loading the wrapping JS GDG Lille
Slide 31
Using it!
Directly from the browser console (it’s a simple demo…) GDG Lille
Slide 32
Communicating between JS and WASM Shared memory, functions…
GDG Lille
Slide 33
Native WASM types are limited WASM currently has four available types: ● ● ● ●
i32: 32-bit integer i64: 64-bit integer f32: 32-bit float f64: 64-bit float
Types from languages compiled to WASM are mapped to these types GDG Lille
Slide 34
How can we share data?
GDG Lille
Using the same data in WASM and JS? Shared linear memory between them!
Slide 35
Some use cases What can I do with it?
GDG Lille
Slide 36
Tapping into other languages ecosystems
Don’t rewrite libs anymore GDG Lille
Slide 37
Replacing problematic JS bits
Predictable performance Same peak performance, but less variation GDG Lille
Slide 38
AssemblyScript Writing WASM without learning a new language
GDG Lille
Slide 39
TypeScript subset compiled to WASM
Why would I want to compile TypeScript to WASM? GDG Lille
Slide 40
Ahead of Time compiled TypeScript
More predictable performance GDG Lille
Slide 41
Avoiding the dynamicness of JavaScrip
More specific integer and floating point types GDG Lille
Slide 42
Objects cannot flow in and out of WASM yet
Using a loader to write/read them to/from memory GDG Lille
Slide 43
No direct access to DOM
Glue code using exports/imports to/from JavaScript GDG Lille
Slide 44
WASM outside the browser Not only for web developers
GDG Lille
Slide 45
Run any code on any client… almost
Languages compiling to WASM GDG Lille
Slide 46
Includes WAPM
The WebAssembly Package Manager GDG Lille
Slide 47
But I need some POSIX
WebAssembly System Interface GDG Lille
Slide 48
Huge potential
GDG Lille
Slide 49
Future To the infinity and beyond!
GDG Lille
Slide 50
WebAssembly Threads
Threads on Web Workers with shared linear memory GDG Lille
Slide 51
SIMD
GDG Lille
Slide 52
Garbage collector
And exception handling GDG Lille