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
WASM
Search
Polina Gurtovaya
January 22, 2020
Programming
250
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
WASM
WebAssebmly for beginners
Polina Gurtovaya
January 22, 2020
More Decks by Polina Gurtovaya
See All by Polina Gurtovaya
Не учите алгоритмы
hellsquirrel
1
1.1k
Давайте все заблокируем
hellsquirrel
0
380
Wasmысле?
hellsquirrel
0
290
Магия декларативныx схем.
hellsquirrel
0
410
ML for HolyJS
hellsquirrel
0
210
Идеальный способ заблюрить белочку
hellsquirrel
0
200
ML/DL на фронте
hellsquirrel
0
250
InsertableStreams
hellsquirrel
0
120
WebRTC-404
hellsquirrel
0
590
Other Decks in Programming
See All in Programming
地方こそサーバーレス — 10年続けた、顔が見えるチームで確かな基盤を / Serverless Matters Most in Regional Areas — 10 Years of Building Reliable Foundations with Close-Knit Teams
seike460
PRO
1
310
オーケストレーション記述言語 Katari
yukikurage
0
240
AI時代のTerminal環境を UNIX哲学で設計・運用する
yasunori0418
1
350
AI時代のIaC入門 〜なぜインフラをコードで管理したいのか?〜 / Introduction to IaC in the AI Era
akihisaikeda
6
1.4k
Long Living Tokens, Die, Die, Die! (or: The One Ring is Banned in Modern)
sylph01
0
410
Moscow Python Meetup №112. Как поселить ИИ агентов в event driven архитектуре
moscowdjango
PRO
0
110
作れる、でも消せるか?──安全に「枯らして消す」機能削除術 / Drain, Then Delete
chobishiba
3
1.4k
小さなアプリを作って公開するまで
onozaty
0
150
PumaからFalconに移行したRailsアプリケーションでの実践
falcon8823
0
370
Next.js: The final boss of Web Performance
guaca
0
390
そのデザイントークン、Flutterでも同じ見た目になりますか?
nakamizu
0
310
自作Discord音声botをLambda MicroVMsに移行した話 / Migrating My Discord Voice Bot to Lambda MicroVMs
akihisaikeda
1
300
Featured
See All Featured
Color Theory Basics | Prateek | Gurzu
gurzu
1
510
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
310
XXLCSS - How to scale CSS and keep your sanity
sugarenia
250
1.3M
How to train your dragon (web standard)
notwaldorf
96
6.9k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
240
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
18k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.2k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
330
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.6k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
8.4k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
740
エンジニアに許された特別な時間の終わり
watany
109
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