-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathoops-i-replaced-containers-with-wasm.html
438 lines (267 loc) · 12.2 KB
/
oops-i-replaced-containers-with-wasm.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
<!DOCTYPE html>
<html>
<head>
<title>Oops! I replace containers with Wasm</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<textarea id="source">
class: middle, center
# Oops! I replaced containers with WebAssembly
<img
style="border-radius: 50px"
src="https://www.gravatar.com/avatar/67644641ead7ae60a795a14b7e102973?s=100"
alt="Weihang Lo">
<a href="https://github.com/weihanglo">@weihanglo</a>
---
class: top, center
## Is it real?
[<img width="80%" src="oops-i-replaced-containers-with-wasm/solomonstre.png">](https://twitter.com/solomonstre/status/1111004913222324225)
---
## What are today's objective?
- Know what WebAssembly is
- Know what WebAssembly isn't
- Know what WebAssembly can
- Know what WebAssembly cannot
---
## Is Wasm an assembly?
Yes!
- A binary instruction format for a virtual machine
- A compilation target: LLVM to Wasm
- [With well-defined specifications][core spec]
<img width="65%" src="https://hacks.mozilla.org/files/2017/02/04-02-langs08-768x501.png">
Ref: [@linclark](https://twitter.com/linclark)
---
## Is Wasm an assembly?
```wasm
(func (param $p i32)
(result i32)
local.get $p
local.get $p
i32.add)
```
```wasm
(module
(import "js" "memory" (memory 1))
(import "js" "table" (table 1 funcref))
(type $void_to_i32 (func (result i32)))
(func (export "doIt") (result i32)
i32.const 0
i32.const 42
i32.store ;; store 42 at address 0
i32.const 0
call_indirect (type $void_to_i32))
)
```
---
## You mentioned VM. Is Wasm a VM?
Yes!
- ❌ A duplication of a computer system
- ✅ A managed programming runtime environment
![](https://upload.wikimedia.org/wikipedia/zh/8/88/Java_logo.png)
---
## You mentioned VM. Is Wasm a VM?
- 👌 Portability\*: Write once. ~~Debug~~ Embed anywhere.
- 👌 Security: VM controls the environment.
- 🚀 Performance: Faster runtime and startup time.
- 🚀 More security: Everything is an import.
\*: [Assumptions apply]
---
### [`binop` execution](https://webassembly.github.io/spec/core/exec/instructions.html#t-mathsf-xref-syntax-instructions-syntax-binop-mathit-binop)
![](oops-i-replaced-containers-with-wasm/binop.png)
---
### Definition of [`modules`]
<img width="80%", src="oops-i-replaced-containers-with-wasm/modules.png">
---
## What really is Wasm?
Assembly / Instruction Set
### +
Execution (with an implementation)
> Types, values, instructions, executions. All these are defined in [core spec].
---
## Sounds like a JVM. Why faster?
- 👍 Codegen and optimization via modern compiler backend.
- 👍 Stream-line, parallelized parsing and decoding = [fast startup time]
- 👍 No GC. You got the whole linear address space.
- 👎 Actually it is [not so fast].
- 👎 Maybe just [equally fast] when [comparing with JavaScript].
<img width="50%" src="oops-i-replaced-containers-with-wasm/usenix.png">
<em style="font-size:8px">Jangda, A., Powers, B., Berger, E. D., & Guha, A. (2019). Not so fast: Analyzing the performance of webassembly vs. native code. In 2019 {USENIX} Annual Technical Conference ({USENIX}{ATC} 19) (pp. 107-120).</em>
---
## What about the security part?
This is the part that Wasm really shines!
- Has no system call
- Has no API
- Shared-nothing in mind
The only way to communicate with outside world is:
<center><h3>Module Imports<h3></center>
Like [Linux capabilities] but need to define your own capabilites.
---
## So far, we know WebAssembly
**... is**
- an ISA with both text and binary format
- an execution of its instructions
**... is not**
- a virtual machine that duplicates the whole OS
- a crypto scheme
<img width="50%" src="https://i.imgur.com/o40IwP7.png">
_Image credit: https://coinsutra.com/bitcoin-ponzi-scheme/_
---
class: middle, center
## Wait. No API no syscall?
## That's totally useless!
Indeed.
But we have module imports.
---
## You mean an interface?
Exactly. There are some embedding interfaces specs:
- [JavaScript API]: Define how to export and import JavaScript objects and environments.
- [WASI - WebAssembly System Interface]: "System calls" for WebAssembly, including filesystem, sockets, etc.
<img width="70%" src="https://github.com/WebAssembly/WASI/blob/41d8c27/docs/wasi-software-architecture.png?raw=true">
---
## So, we need to impl WASI for different archs on our own?
Not really. You can choose a runtime and use it directly.
[<img width="200px" src="https://avatars.githubusercontent.com/u/54038801?s=600">](https://wasmtime.dev/)
[<img width="200px" src="https://v8.dev/_img/v8-outline.svg">](https://v8.dev/)
[<img width="200px" src="https://avatars.githubusercontent.com/u/44205449?s=600">](https://wasmer.io)
[<img width="200px" src="https://wavm.github.io/images/WAVM.svg">](https://wavm.github.io)
[<img width="200px" src="https://avatars.githubusercontent.com/u/83329692?s=600">](https://wasmedge.org/)
[<img width="200px" src="https://avatars.githubusercontent.com/u/58013131?s=600">](https://github.com/wasm3/wasm3)
---
## Stop. Give me a [real world demo!]
<iframe loading="lazy" width="100%" height="500" src="https://sandspiel.club/#a101f87128ec0fa41c4f"></iframe>
---
## Is this Wasm on the web?
AutoCAD uses emscripten to [port 35 years old native application to the web]
![](https://damassets.autodesk.net/content/dam/autodesk/www/products/autocad-web-app/overview-page/descriptive-overview/autocad-web-2020-overview-video-poster-1920x1080.jpg)
---
## Is this Wasm on the web?
[Adobe Photoshop on the web]
![](https://web-dev.imgix.net/image/8WbTDNrhLsU0El80frMBGE4eMCD3/kfFAUTzDHzvE3hXISyQO.png?auto=format&w=1600)
---
## Is this Wasm on the web?
[OpenCV.js]
<img width="100px" src="https://opencv.org/wp-content/uploads/2020/07/cropped-OpenCV_logo_white_600x.png">
[TensorFlow: WebGPL + Wasm = tfjs]
![](https://avatars.githubusercontent.com/u/15658638?s=100)
---
## Is this Wasm on the web?
[Pyodide: Scientific computing entire in your browser]
[![](oops-i-replaced-containers-with-wasm/pyodide.png)](https://alpha.iodide.io/notebooks/300/)
---
## Is this Wasm on the web?
[Doom]. Yes. You read it right. [Doom]!
<iframe loading="lazy" width="100%" height="500" src="https://silentspacemarine.com/"></iframe>
---
## Is this Wasm on the web?
[And Flash is back!]
<iframe loading="lazy" width="100%" height="400" src="https://ruffle.rs/demo/"></iframe>
---
## Is this Wasm on the web?
- Games
- Audio. Video. Graphics
- Machine learning and scientific Computing
- Web frameworks in other programming languages (C#, Rust)
- Any compute-intensive apps
- Just porting C/C++ project to the web and boom! (
- mostly via [Emscripten]
- Storage and rendering still need some rewrites and glue code with Web API
- OpenGL to WebGL
- POSIX API to IndexedDB or web file APIs
---
## What about outside the web?
Edge and distributed computing. But why Cloud Native WebAssembly?
- Fast startup and small footprint
- Wasm engine is small and simple to optimize
- Security (built-in sandboxing)
<img height="24px" src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/8a/Fastly_logo.svg/320px-Fastly_logo.svg.png"> [Compute@Edge]
- Every request is a code start of a Wasm runtime within 50ms
<img height="24px" src="https://github.com/wasmCloud/branding/blob/main/02.Horizontal Version/Vector/SVG/Wasmcloud.Logo-Hrztl_Color.svg?raw=true"> [OTP Wasm computing platform]
- Introduce [waPC], a protocol of procedural calls between native hosts and Wasm guests.
<img height="24px" src="https://www.secondstate.io/assets/img/logo.png"> [FaaS]
- Has its own [WasmEdge] runtime, which is a CNCF project since earlier this year.
---
## What about outside the web?
[Krustlet: Flee from a gigantic platform to the other]
- Replace kubelet and run WebAssembly workload inside Kubernetes
- [wasm-to-oci] uses OCI registries to distribute Wasm modules
![](https://krustlet.dev/images/horizontal.svg)
---
## What about outside the web?
Suitable for blockchain and smart contract VM
- Memory-safe. Sandboxed. Secure.
- Langugage-indenpendant. Write smart contracts with any language you like
- Wasm is well-defined. No need to reinvent the wheel for another sandboxed VM.
- Deterministic\*.
<img height="30px" src="https://polkadot.network/assets/img/logo-polkadot.svg">
<img height="50px" src="https://i.imgur.com/zvhqxXk.png">
<img height="60px" src="https://i.imgur.com/MIm4tYK.png">
\*: [Terms apply]
---
## What about outside the web?
Actually, the line between web and non-web is getting vaguer.
- Edge computing and serverless
- Blockchain. Smart contract.
- Embedded environment
- Any dedicated computing engine
- Policy engine: [Kubewarden], [Open Policy Agent]
- Http filters: [Envoy]
- Run pre-compiled code to speed up compile: [Watt]
---
## Can I replace containers with Wasm?
No. Not in the near feature. Take resources control for example, container has
cgroup and namespaces, whereas Wasm lacks for fine-grained system resource
managemnet.
Also, Wasm is under rapid devlopement. Feature like [Component Model], which
provides module linking without host initiation, has not yet stabilized.
Without proper interfaces between system and Wasm modules, writing Wasm for
impure computation workload would still be in flux.
After all, they serves for different purposes in design at first.
---
## References
- [WebAssembly.org](https://webassembly.org/)
- [InfoQ: Lin Clark on the WebAssembly Component Model](https://www.infoq.com/podcasts/web-assembly-component-model/)
- [WebAssembly: Here Be Dragons @ 2015 LLVM Developer’s Meeting](https://llvm.org/devmtg/2015-10/slides/BastienGohman-WebAssembly-HereBeDragons.pdf)
- [Made with WebAssembly](https://madewithwebassembly.com/)
[core spec]: https://webassembly.github.io/spec/core/
[Assumptions apply]: https://webassembly.org/docs/portability/#assumptions-for-efficient-execution
[`modules`]: https://webassembly.github.io/spec/core/syntax/modules.html
[`binop` execution]: https://webassembly.github.io/spec/core/exec/instructions.html#t-mathsf-xref-syntax-instructions-syntax-binop-mathit-binop
[fast startup time]: https://www.fastly.com/blog/how-compute-edge-is-tackling-the-most-frustrating-aspects-of-serverless
[not so fast]: https://www.usenix.org/conference/atc19/presentation/jangda
[equally fast]: https://www.youtube.com/watch?v=njt-Qzw0mVY&t=1064s
[comparing with JavaScript]: https://surma.dev/things/js-to-asc/
[Linux capabilities]: https://man7.org/linux/man-pages/man7/capabilities.7.html
[JavaScript API]: https://webassembly.github.io/spec/js-api/index.html
[WASI - WebAssembly System Interface]: https://wasi.dev/
[real world demo!]: https://sandspiel.club/#a101f87128ec0fa41c4f
[port 35 years old native application to the web]: https://blogs.autodesk.com/autocad/autocad-web-app-google-io-2018/
[Adobe Photoshop on the web]: https://web.dev/ps-on-the-web/
[Emscripten]: https://emscripten.org
[OpenCV.js]: https://docs.opencv.org/3.4/d4/da1/tutorial_js_setup.html
[TensorFlow: WebGPL + Wasm = tfjs]: https://github.com/tensorflow/tfjs
[Pyodide: Scientific computing entire in your browser]: https://hacks.mozilla.org/2019/04/pyodide-bringing-the-scientific-python-stack-to-the-browser/
[Doom]: https://silentspacemarine.com/
[And Flash is back!]: https://ruffle.rs/
[Compute@Edge]: https://www.fastly.com/products/edge-compute/serverless
[OTP Wasm computing platform]: https://wasmcloud.com/
[waPC]: https://wapc.io/
[FaaS]: https://www.secondstate.io/
[WasmEdge]: https://wasmedge.org/
[Krustlet: Flee from a gigantic platform to the other]: https://krustlet.dev/
[wasm-to-oci]: https://github.com/engineerd/wasm-to-oci
[Terms apply]: https://github.com/WebAssembly/design/blob/e2be77e/Nondeterminism.md
[Kubewarden]: https://www.kubewarden.io/
[Open Policy Agent]: https://www.openpolicyagent.org/docs/latest/wasm/
[Envoy]: https://www.envoyproxy.io/docs/envoy/latest/configuration/http/http_filters/wasm_filter
[Watt]: https://github.com/dtolnay/watt
[Component Model]: https://github.com/WebAssembly/component-model/tree/initial-contents
</textarea>
<script src="https://remarkjs.com/downloads/remark-latest.min.js" type="text/javascript">
</script>
<script type="text/javascript">
var slideshow = remark.create();
</script>
</body>
</html>