WASM - Speaker Deck

Slide 1

Slide 1 text

WASM

Slide 2

Slide 2 text

Давным-давно, когда кода на С++ было много, а на JS мало 2 Появился emscripten

Slide 3

Slide 3 text

Slide 4

Slide 4 text

И зачем тогда изобретать велосипед? 4 Потому что JS слишком долго парсить. Говорят что WASM в 20 раз быстрее Кое-что, связанное со скоростью, но об этом позже

Slide 5

Slide 5 text

Опыт “портирования” позволил быстро запилить `emcc WASM=1` 5

Slide 6

Slide 6 text

Смотрим демку 6

Slide 7

Slide 7 text

На самом деле все примерно так 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"

Slide 8

Slide 8 text

А что насчет RUST? 8 https://rustwasm.github.io/wasm-pack/installer/ https://rustwasm.github.io/docs/book/game-of-life/setup.html

Slide 9

Slide 9 text

AssemblyScript — почти как typescript, но компилируется в WASM 9

Slide 10

Slide 10 text

10 Это была история про portability

Slide 11

Slide 11 text

А теперь начинается история про WASM 11

Slide 12

Slide 12 text

WASM — binary instruction format for a stack-based virtual machine 12

Slide 13

Slide 13 text

WASM для WEB ? 13

Slide 14

Slide 14 text

Принципы: • Модульность из коробки • Живет в песочнице • Работает быстро • Не ломает Web

Slide 15

Slide 15 text

У 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.

Slide 16

Slide 16 text

У WASM 2 формата 16

Slide 17

Slide 17 text

Так как бинарники особо не поразбираешь, давайте поговорим про текстовый формат 17

Slide 18

Slide 18 text

Выглядит он вот так: 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"))

Slide 19

Slide 19 text

Демка wat2wasm 19

Slide 20

Slide 20 text

Локальная демка 20

Slide 21

Slide 21 text

Окей, что насчет скорости? 21

Slide 22

Slide 22 text

Как работает JS в браузере на примере V8 22 V8 это движок, написаный на C++. Он используется с Chromium и NodeJS. V8 заставляет код работать. Раньше это был только JS код. Теперь это JS и WASM

Slide 23

Slide 23 text

Slide 24

Slide 24 text

Как работает компилятор? :) 24 Сложно он работает :)

Slide 25

Slide 25 text

Slide 26

Slide 26 text

В общем: 26 Как быстро произойдет “interactive” предсказать сложно Скорость *не* определяется размером бандла (хотя это афектит) На мобилках все может быть в 5 раз медленнее

Slide 27

Slide 27 text

Slide 28

Slide 28 text

Помните вот это? 28 WebAssembly.instantiateStreaming WASM можно компилировать еще *до* загрузки

Slide 29

Slide 29 text

WASM = predictable performance 29

Slide 30

Slide 30 text

Статус WASM: MVP 30 Пока лучше всего поддерживается компиляция из С/C++ Работает в V8 примерно с февраля 2017 LLVM based-projects Все достаточно “сыро”