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
WASM
Search
Polina Gurtovaya
January 22, 2020
Programming
2
170
WASM
WebAssebmly for beginners
Polina Gurtovaya
January 22, 2020
Tweet
Share
More Decks by Polina Gurtovaya
See All by Polina Gurtovaya
Не учите алгоритмы
hellsquirrel
1
860
Давайте все заблокируем
hellsquirrel
0
270
Wasmысле?
hellsquirrel
0
170
Магия декларативныx схем.
hellsquirrel
0
310
ML for HolyJS
hellsquirrel
0
94
Идеальный способ заблюрить белочку
hellsquirrel
0
120
ML/DL на фронте
hellsquirrel
0
160
InsertableStreams
hellsquirrel
0
68
WebRTC-404
hellsquirrel
0
470
Other Decks in Programming
See All in Programming
Swiftコンパイラ超入門+async関数の仕組み
shiz
0
190
Moscow Python Meetup №97. Константин Крестников (Техлид команды GigaChain (SberDevices)). GigaChain: Новые инструменты для разработки агентов на примере агента техподдержки
moscowdjango
PRO
0
100
Оптимизируем производительность блока Казначейство
lamodatech
0
990
ATDDで素早く安定した デリバリを実現しよう!
tonnsama
1
2.4k
rails newと同時に型を書く
aki19035vc
6
740
JavaScriptツール群「UnJS」を5分で一気に駆け巡る!
k1tikurisu
8
1.3k
watsonx.ai Dojo #6 継続的なAIアプリ開発と展開
oniak3ibm
PRO
0
270
ASP. NET CoreにおけるWebAPIの最新情報
tomokusaba
0
190
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
240
Package Traits
ikesyo
2
230
Amazon Bedrock Multi Agentsを試してきた
tm2
1
220
動作確認やテストで漏れがちな観点3選
starfish719
5
860
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
427
64k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
3
380
Music & Morning Musume
bryan
46
6.3k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
45
2.3k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.3k
Become a Pro
speakerdeck
PRO
26
5.1k
Why Our Code Smells
bkeepers
PRO
335
57k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
BBQ
matthewcrist
85
9.4k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
WASM
Давным-давно, когда кода на С++ было много, а на JS
мало 2 Появился emscripten
3
И зачем тогда изобретать велосипед? 4 Потому что JS слишком
долго парсить. Говорят что WASM в 20 раз быстрее Кое-что, связанное со скоростью, но об этом позже
Опыт “портирования” позволил быстро запилить `emcc WASM=1` 5
Смотрим демку 6
На самом деле все примерно так 7 "emcc -O3 -s
WASM=1 -s ENVIRONMENT=\"web\" -s EXTRA_EXPORTED_RUNTIME_METHODS='[\"cwrap\"]' -s MODULARIZE=1 -s ‘EXPORT_NAME=\”blah-blah\"' -I src/wasm/ libwebp src/wasm/libwebp/src/ {dec,dsp,demux,enc,mux,utils}/*.c -I src/wasm/zlib src/ wasm/zlib/inf*.c src/wasm/zlib/ {zutil.c,adler32.c,crc32.c} -o src/wasm/encoders.js src/ wasm/encoders.c"
А что насчет RUST? 8 https://rustwasm.github.io/wasm-pack/installer/ https://rustwasm.github.io/docs/book/game-of-life/setup.html
AssemblyScript — почти как typescript, но компилируется в WASM 9
10 Это была история про portability
А теперь начинается история про WASM 11
WASM — binary instruction format for a stack-based virtual machine
12
WASM для WEB ? 13
Принципы: • Модульность из коробки • Живет в песочнице •
Работает быстро • Не ломает Web
У WASM есть спека (даже не одна) И там ни
слова о web :) 15 A WebAssembly implementation will typically be embedded into a host environment. An embedder implements the connection between such a host environment and the WebAssembly semantics.
У WASM 2 формата 16
Так как бинарники особо не поразбираешь, давайте поговорим про текстовый
формат 17
Выглядит он вот так: 18 (module (func $i (import "imports"
"logger") (param i32)) (memory (import "imports" "importedMemory") 1) (func (export "exportedFunc") i32.const 42 call $i) (func (export "add") (param i32 i32) (result i32) local.get 0 local.get 1 i32.add) (data (i32.const 0) "Fifty"))
Демка wat2wasm 19
Локальная демка 20
Окей, что насчет скорости? 21
Как работает JS в браузере на примере V8 22 V8
это движок, написаный на C++. Он используется с Chromium и NodeJS. V8 заставляет код работать. Раньше это был только JS код. Теперь это JS и WASM
23
Как работает компилятор? :) 24 Сложно он работает :)
25
В общем: 26 Как быстро произойдет “interactive” предсказать сложно Скорость
*не* определяется размером бандла (хотя это афектит) На мобилках все может быть в 5 раз медленнее
27
Помните вот это? 28 WebAssembly.instantiateStreaming WASM можно компилировать еще *до*
загрузки
WASM = predictable performance 29
Статус WASM: MVP 30 Пока лучше всего поддерживается компиляция из
С/C++ Работает в V8 примерно с февраля 2017 LLVM based-projects Все достаточно “сыро”
WASM дополняет JavaScript а не заменяет 31
32 Примерчики с MDN