Web Assembly (Wasm) is a new format for running compiled code on the web. It aims to provide better performance than JavaScript by allowing code written in languages like C/C++ to run in the browser as fast native code. Wasm modules define functions, memory, and other objects and can be compiled to a small size and load quickly. It features a portable binary format and JavaScript integration, allowing compiled code to interface with web APIs and DOM. Wasm pursues goals of portability, security, and integration with web standards to enhance browser performance without plugins.

1. Web Assembly
A lightweight introduction

2. About me

3. Outline
● What is WA
● Why WA
● Chasing performance
● Feature
● Demo
● The future
● Q&A

5. What is Web Assembly?

6. WebAssembly, or wasm, is a new portable, size-
and load-time-efficient format suitable for
compilation to the web.

8. It’s a virtual machine for the web!

9. Why Web Assembly?

10. because of Javascript

11. ● Freedom to choose a different language
○ Run CC++ codebase in a browser
● Performance
○ Dynamic Typed language
○ engine optimization
○ JS bottlneck
Why WA

12. Chasing performance

13. ● engine
○ parse source
○ create AST
○ create machine code
● code optimization - turboFan
○ looking for slow function
○ optimization
○ code analisys is CPU intensive
Chasing performance - Javascript

14. Javascript V8 Engine

15. function add(a, b) {
return a + b;
}

16. Javascript addition operator semantic

17. Javascript addition operator semantic

18. Javascript addition operator semantic

19. Javascript addition operator semantic

20. Javascript addition operator semantic

21. ● plugins
○ Flash
○ Java
● Google Native Client (NaCl)
○ Open Source
○ Run native code in a sandbox
● asm.js
○ compiler target
○ c++ to Javascript (subset) fast native code
○ different performance over different engine
Chasing performance

22. Feature

23. Feature - Goal
● Portable
● Extendible
● Integrated with Web Standard
● Using existing tools

24. Feature
● Compile target
● Internal browser VM
● Cross browser support
● Javascript API
● Version 1 (MVP)

25. Module:
distributable, loadable, and executable unit of code

26. Feature - Module
● import
● export
● start
● global
● memory
● data
● table
● elements
● functions

27. Feature - Module
● index spaces
○ function
○ table
○ global
○ linear memory

28. Feature - Module
● Binary encoding
○ Efficient and fast
○ Stack based VM
○ Native speed
● Text format
○ LISP like

29. Feature - Javascript API
● Integrated with Web Platform
○ WebAPIs via JS
○ JS interoperability

31. Feature - Type
● types
○ void
○ i32
○ i64
○ f32
○ f64

32. Feature - Memory
● linear memory
○ untyped array of bytes
○ 64KiB page size
● grow_memory operator

33. Feature - Memory
● operators
○ load
○ store
● effective address
○ sum of address operand and an
offset operand
● out-of-bound check
○ out-of-bound trap

34. Feature - Security
● sandbox
○ using only API
● security policies of its
embedding
● function declared at load time

35. Feature - Security
● control flow integrity (CFI)
○ Function call
○ Indirect function call
○ returns
● By design

36. Feature - Tools

37. It’s time for a demo!

38. Demo

39. Demo
● http://webassembly.org/demo/
● https://s3.amazonaws.com/mozilla-games/ZenGarden/EpicZenGarden.ht
ml

40. What’s next?

41. ● Garbage collector
○ Support new languages
● Multithread support
● wasm64
● Exception handling
What’s next?

42. Questions?

43. valeriocomo
Thank you!|
@valeriocomo
valeriocomo@gmail.com
http://www.valeriocomo.com

44. References
● http://www.webassemly.org
● https://en.wikipedia.org/wiki/Type_system
● http://webassembly.org/docs/semantics/
● http://webassembly.org/docs/modules/
● http://webassembly.org/docs/mvp/
● http://webassembly.org/docs/future-features/
● https://youtu.be/6v4E6oksar0
● https://youtu.be/DKHuEkmsx3M

45. References
● https://rsms.me/wasm-intro