Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
WebAssembly in NodeJS
Search
Willian Martins
October 17, 2017
Technology
660
4
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
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
170
Além do else! Categorizando Pokemóns com Pattern Matching no JavaScript
wmsbill
0
890
De volta ao Futuro do JS: As próximas features e propostas incríveis
wmsbill
0
120
Back to the future of JS II: Beyond what we can foresee
wmsbill
0
150
A, B, C. 1, 2, 3. Iterables you and me.
wmsbill
0
130
Back to the future of JS II: Beyond what we can foresee
wmsbill
0
150
Back to the future of JS.
wmsbill
0
11
Node conf ar 2018.
wmsbill
0
670
Back to the future of JS
wmsbill
1
100
Other Decks in Technology
See All in Technology
VS Code × GitHub Copilot での Fabric 開発
ryomaru0825
1
210
オブザーバビリティを高める AI エージェント体験を考える / Designing AI Agent Experiences That Enhance Observability
aoto
PRO
1
130
MCPゲートウェイを作って運用してわかったこと — Agent時代の権限管理の現在地
mtpooh
9
2.5k
『GOエコノミー 』(相乗りサービス) におけるスペック駆動開発
mot_techtalk
1
120
1万名の社員が使う認証基盤で どう信頼性を担保するか?
kairim0
0
120
1人アドミンな私はAWSアカウント申請をSlackで完結したい!
ysuzuki
0
110
サーバーフルコンピューティング?AWS Lambda
iwatatomoya
0
110
PQC移行の今 -- IETF からみた現在地
satokan
4
720
高負荷プロダクション環境におけるAWS Lambdaのリアル 〜スケールとコストを左右する実行ライフサイクルの技術仕様〜
maimyyym
2
840
私の推しは「聞いてから進む」AIです -AI-DLCに一人でアプリを作らせた話
yama3133
0
150
覗いてみよう 関数型ビジュアル言語×2Dグラフィックスの世界
yohyamasaki
0
160
20260930_Gemma4_Hands-on
tsho
0
200
Featured
See All Featured
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
380
Speed Design
sergeychernyshev
33
2.1k
Navigating Team Friction
lara
192
16k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9.2k
A Modern Web Designer's Workflow
chriscoyier
699
190k
Marketing to machines
jonoalderson
1
5.8k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
What does AI have to do with Human Rights?
axbom
PRO
1
2.4k
Darren the Foodie - Storyboard
khoart
PRO
4
4k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Accessibility Awareness
sabderemane
1
230
What’s in a name? Adding method to the madness
productmarketing
PRO
24
4.2k
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?