Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WebAssembly in NodeJS
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Willian Martins
October 17, 2017
Technology
640
4
Share
WebAssembly in NodeJS
My presentation about WASM in NodeJS @ NodeJS Meetup Berlin
Willian Martins
October 17, 2017
More Decks by Willian Martins
See All by Willian Martins
Empirical Observations on the The Future of Scalable UI Architecture
wmsbill
0
160
Além do else! Categorizando Pokemóns com Pattern Matching no JavaScript
wmsbill
0
880
De volta ao Futuro do JS: As próximas features e propostas incríveis
wmsbill
0
110
Back to the future of JS II: Beyond what we can foresee
wmsbill
0
140
A, B, C. 1, 2, 3. Iterables you and me.
wmsbill
0
110
Back to the future of JS II: Beyond what we can foresee
wmsbill
0
140
Back to the future of JS.
wmsbill
0
11
Node conf ar 2018.
wmsbill
0
650
Back to the future of JS
wmsbill
1
91
Other Decks in Technology
See All in Technology
大学生が本気でDatabricksを活用してDiscordサークルをデータ駆動させてみた
phantomjuju
1
300
TypeScript Compiler APIとPHP-Parserを活用し、TypeScriptとPHPで型を共有する
shuta13
0
270
マーケットプレイス版Oracle WebCenter Content For OCI
oracle4engineer
PRO
5
1.7k
Java正規表現エンジン(NFA)の仕組みと パフォーマンスを維持するための最適化手法
takeuchi_132917
0
160
layerx-fde-practices
cipepser
6
2.9k
ITエンジニアを取り巻く環境とキャリアパス / A career path for Japanese IT engineers
takatama
4
1.8k
基礎から解説!Icebergで紐解くSnowflake×Databricks連携の現在地
cm_yasuhara
0
410
Oracle Cloud Infrastructure:2026年5月度サービス・アップデート
oracle4engineer
PRO
1
270
イベントストーミングとKiroの仕様駆動開発で実現する要件の認識合わせプロセス
syobochim
7
980
美味しいスイスチーズを作ろう🧀🐭
taigamikami
1
190
「使われるデータ基盤」を目指してデータアナリストとワークショップをやった話
jackojacko_
2
940
もりもり新機能を一挙紹介! AgentCoreに入門して、AWS上にAIエージェントを構築しよう
minorun365
PRO
5
350
Featured
See All Featured
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
200
The Cost Of JavaScript in 2023
addyosmani
55
10k
The Mindset for Success: Future Career Progression
greggifford
PRO
0
340
Producing Creativity
orderedlist
PRO
348
40k
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
820
Building Flexible Design Systems
yeseniaperezcruz
330
40k
Skip the Path - Find Your Career Trail
mkilby
1
130
Into the Great Unknown - MozCon
thekraken
41
2.5k
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
540
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
320
Product Roadmaps are Hard
iamctodd
PRO
55
12k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
150
Transcript
The Need for Speed and WebAssembly Willian Martins Autumn 2017
None
Timeline…
How did we achieve it Moore law Pushed Tech industries
to evolve until today Allowed huge computation power even on small devices
All this power for what? Faster applications More immersive games
Virtual reality Augmented reality Live video/image processing Big Data/Machine learning
The languages over time
But what about JS?
JS - Early days Created in 1995 by Brendan Eich
Was written in 11 days Designed to be easy and simple Designed to be a glue code for dynamic Web
None
JS - 2008 until now 2008 - JIT Compiler by
google w/ Chrome Jump of performance Allowed more complex applications What is the next step?
Willian Elia @wmsbill
None
WE’RE HIRING!!
What is WebAssembly?
What’s WebAssembly? New binary format Run compiled programs (C, C++,
Rust) on a browser Works alongside Javascript Performance and flexibility API
Why WebAssembly is faster?
V8 - JiT in action
V8 - JiT in action
V8 - JiT in action
V8 - JiT in action
V8 - JiT in action
V8 - JiT in action
V8 - JiT in action
JiT: Code life cycle in summary 1. Parse 2. Compile
3. Optimize (de-optimize) 4. Execute 5. Garbage Collector
WebAssembly
WebAssembly is fast Parse Compile Optimize Execute GC Decode Compile
+ Optimize Execute JS WASM
WebAssembly is fast WASM is more compact -> Faster FETCH
of the source WASM is closer to machine code -> Faster DECODING, COMPILING and OPTIMISING No need to RE-OPTIMISE No garbage collection
So WebAssembly looks fast, let’s see how to use it
How to run WASM modules Current situation: not possible to
run WASM modules on their own Need for some Javascript glue
WebAssembly JS API 1. Fetch/Load the module binary 2. Instantiate
it 3. Access exported functionalities
fs.readFile(‘./module.wasm’, async function(err, file) => { const { instance }
= await WebAssembly.instantiate(file); // Do something with the compiled results! });
How to generate a WASM file
Compile C to WASM + JS WASM emcc my-module.c -o
my-module.js -s WASM=1
Then we can simply import the generated JS code as
a module
Export functions to JS Keyword EMSCRIPTEN_KEEPALIVE EMSCRIPTEN_KEEPALIVE int sum(int x,
int y) { return x + y; } Expose only the interface of the WASM module to JS
What about WebAssembly memory? How can we access it?
Memory management Emscripten provide three useful functions to manage WebAssembly
memory _malloc(memoryNeeded) getValue(ptr, type) setValue(ptr, value, type)
Elia @eliamain
DEMO TIME
The WASM implementation was still slower
Why??
JIT handover
“Currently, calling a WebAssembly function in JS code is slower
than it needs to be. The JIT doesn’t know how to deal directly with WebAssembly, so it has to route the WebAssembly to something that does. … This can be up to 100x slower than it would be if the JIT knew how to handle it directly. ” Lin Clark
The future of WebAssembly
Future features Formal Specification Threads supports SIMD acronym to Single
Instruction Multiple Data (back to Stage 3 on TC39) Exception handling Garbage collection Direct DOM access ES6 Module integration
Danke! Thank you!
What about Native modules?