WebAssembly is a new low-level compilation target that provides better performance than JavaScript without compromising on portability and security. It runs at native speed by taking advantage of common hardware capabilities available on a wide range of platforms. WebAssembly code is portable and works consistently across multiple browsers without modifications. It also inherits JavaScript's security model and allows safe sandboxing of code.

1. WEB
ASSEMBLY
OLEKSANDR SKACHKOV @alSkachkov

2. ABOUT ME
• Itera’s FrontEnd Tech Lead
• WebKit contributor & JS hacker:
• Arrow function
• Async iterator & generators
• Promise.finally
• Twitter: @alSkachkov

3. WEB ASSEMBLY
OVERVIEW
• What was before
• WebAssembly – what is it
• WebAssembly– wasm format
• WebAssembly– what is next

4. HOW JS EVOLVE
• Netscape Navigator 2.0 in 1995:
• JS was born
• NPAPI – for Java plugins
• IE 3.0 - ActiveX
• Flash player initial release - 1996
• HTML5
• JiT – in modern JS engines - 2008
• Aggressive optimization algorithms and ASM.js

5. THE STRENGTH IS A WEAKNESS
• Easy to learn
• Executes in browser environment
• Dynamic typing
=
• LOW PERFORMANCE!

6. HOW BROWSER EXECUTE JS

7. HOW TO SOLVE BY TOOLS
• Frameworks
• Minifiers
• Optimizers – Prepack
• Rules and Hacks

8. TRIES TO SOLVE IN BROWSER
asm.js

10. • Announced in 17 June 2015
• Will be developed by major Browsers
• Developed by WebAssembly Working
Group
WebAssembly - Game Changer

11. What is WebAssembly (aka WASM)?

12. WebAssembly is build target

13. Will WebAssembly replace JavaScript?

14. Will WebAssembly replace JavaScript?
Not now 

15. but WebAssembly will transform web

16. safe, portable, low-level code format designed for efficient execution
and compact representation
https://webassembly.github.io/spec/intro

17. safe, portable, low-level code format designed for efficient execution
and compact representation
https://webassembly.github.io/spec/intro

18. fast to load

19. binary format
fast to load

20. fast to load

21. fast to load

22. fast to parse

23. fast to parse
S - expression

24. fast to parse
no ambiguous syntax

25. fast to parse
no ambiguous syntax
binary format

26. fast to parse
no ambiguous syntax
Only 2 phase before execution: decode, validation
binary format

27. safe, portable, low-level code format designed for efficient execution
and compact representation
https://webassembly.github.io/spec/intro

28. fast to execute

29. fast to execute
close to browser IR

30. fast to execute
1.2x speed of the native code
close to browser IR

31. HOW BROWSER EXECUTE WASM
JS
WASM

32. safe, portable, low-level code format designed for efficient execution
and compact representation
https://webassembly.github.io/spec/intro

33. SAFE
• Limit set of operation
• Controlled operations with memory
• Using import table

34. MEMORY MODEL
• 8-bit bytes
• Linear memory
• Simulates the heap
• Used ArrayBuffer
• Memory.import can be used by several WASM modules

35. HOW TO WORK IN BROWSER
• WebAssembly object
• No access to web API or DOM
• Integration with JavaScript

36. INTERACTION WITH JAVASCRIPT
We can use JS function in WASM and WASM function in JS

37. INTERACTION WITH JAVASCRIPT
We can use JS function in WASM and WASM function in JS

38. INTERACTION WITH JAVASCRIPT
We can use JS function in WASM and WASM function in JS

39. WASM Binary format demystification

40. fast to load

41. WASM Code explorer
https://wasdk.github.io/wasmcodeexplorer/

42. WASM Code explorer
https://wasdk.github.io/wasmcodeexplorer/

43. Binary encoding
https://github.com/WebAssembly/design/blob/master/BinaryEncoding.md
WASM Code explorer
https://wasdk.github.io/wasmcodeexplorer/

44. fast to load

45. fast to load

46. fast to load

47. fast to load

48. fast to load

52. USAGE SCENARIOS
• Write faster version of the specific application
• Using existing C libraries in browser
• Reuse algorithm from service side
• Distribute whole application as WebAsm

53. Ethereum flavored WebAssembly

54. BUILD TARGET FOR
• C/C++
• TypeScript/TurboScript
• Rust
• C#
• Go

55. VM
• Blazor: NET code in the browser via the Mono runtime, which itself
is compiled to WebAssembly and asm.js (Steve Sanderson)
• TeaVM: transpiler of Java bytecode, to emit JavaScript and
WebAssembly (Java, Kotlin, Scala) (Alexey Andreev)
• Ocamlrun: OCaml bytecode interpreter for WebAssembly
(Sebastian Markbåge)

56. CAN WE USE WEBASSEMBLY?
Global support 65% + nodejs >7.2.X
Yes we can

58. FUTURE
• GC – garbage collector
• Threads
• Exception handling
• Tools
• SIMD - single instruction, multiple data
• More proposals coming

59. EXAMLES
• Video editor https://d2jta7o2zej4pf.cloudfront.net/
• Game: http://webassembly.org/demo/Tanks/
• Garden for Mozilla: https://s3.amazonaws.com/mozilla-
games/ZenGarden/EpicZenGarden.html
• WebSight: https://websightjs.com/

60. RESOURCES
• Twitter @WasmWeekly - WebAssemblyWeekly
• Site http://webassembly.org/
• Github https://github.com/WebAssembly/