面向未来的前端技术
如果无法正常显示，请先停止浏览器的去广告插件。
1. Jamstack 与 WebAssembly 在
大前端时代的应用与发展
Michael Yuan
WasmEdge Creator and Maintainer
2. • 什么是 Jamstack
• Serverless 的崛起
• Wasm 与 Docker
• 用 JavaScript 改进 Wasm 的开发者体验
• 用云原生的工具部署与管理 Wasm
3.
4.
5.
6.
7. • 什么是 Jamstack
• Serverless 的崛起
• Wasm 与 Docker
• 用 JavaScript 改进 Wasm 的开发者体验
• 用云原生的工具部署与管理 Wasm
8. Jamstack
API：微服务或 Serverless 函数
9. Serverless 的发展
10. Serverless 函数太慢了
11. • 什么是 Jamstack
• Serverless 的崛起
• Wasm 与 Docker
• 用 JavaScript 改进 Wasm 的开发者体验
• 用云原生的工具部署与管理 Wasm
12. 历史总是惊人的相似但是不会简单重复
Serverless 代码
容易上手
•
•
•
•
•
解耦
Polygot
可移植的
安全
不需运维
Managed Code
1999
2009
2020
13. Wasm 更快更轻
A Lightweight Design for
High-performance
Serverless Computing,
IEEE Software, Jan
2021.
https://arxiv.org/abs/20
10.07115
14. Wasm 比 Docker 更抽象
Hypervisor VM 和 microVM
高级语言 VM
应用容器
• AWS Firecracker •
• 模拟计算机 •
Docker
模拟私有操作系统
•
v8、 JVM、 WebAssembly
•
https://www.infoq.com/news/2020/07/future-serverless-architecture/
https://twitter.com/Joab_Jackson/status/1430634807277629450
Ruby / Python runtimes、
模拟一个进程
15. 目前，Docker 更容易上手
Docker
• 支持任何语言和任何框架
• 经常被当做开发者工具
Wasm
• 虽然多语言，但需要编译器和
SDK 支持
• C/C++、Rust、Swift、Kotlin
和 AssemblyScript 是一等公⺠
• 被当做 runtime，是操作系统服
务的一部分
16. • 什么是 Jamstack
• Serverless 的崛起
• Wasm 与 Docker
• 用 JavaScript 改进 Wasm 的开发者体验
• 用云原生的工具部署与管理 Wasm
17. 改进 Wasm 的开发者体验
18. 为高性能应用优化的
WebAssembly Runtime
https://github.com/WasmEdge/WasmEdge
19. 重要的用例
微服务的云原生 runtime
•
• Dapr
• Kubernetes
• Service mesh
• 公有云的 serverless runtime
• SaaS 的嵌入式 runtime
20. Wasm 中的 JavaScript
21. https://github.com/second-state/wasmedge-quickjs
22. 这是怎么工作的
编译成 Wasm 的编译器
•
•
把 WasmEdge 扩展做为 JS API
•
•
支持 ES6 modules
• Networking
• 图像处理
• KV 存储
• AI 推理
允许本机 C 库成为 JS API
23. 使用 TensorFlow 进行AI 推理
24. 异步 HTTP 服务
25. ES6 modules
26. CommonJS modules
27. NPM modules
28. 用 Rust 来加速 JavaScript
29. 这会不会太慢？
• 比 Node + Ubuntu + Docker 快得多
• 对于 Tensorflow 等本机函数，比 V8 快得多
• 不比 V8 解释器慢，但更轻（1/40 大小）
• V8 JIT 不安全
30. • 什么是 Jamstack
• Serverless 的崛起
• Wasm 与 Docker
• 用 JavaScript 改进 Wasm 的开发者体验
• 用云原生的工具部署与管理 Wasm
31. 部署与 DevOps
在 Docker 里面部署 Wasm
Wasm 与 Docker 一起运行
• Vercel • Dapr
• Netlify • Kubernetes
• 腾讯云 Serverless • Service mesh
32. 在 Docker 里面部署 Wasm
Vercel
https://www.secondstate.io/articles/vercel-wasmedge-webassembly-rust/
Netlify
https://www.secondstate.io/articles/netlify-wasmedge-webassembly-rust-serverless/
腾讯云 Serverless
https://my.oschina.net/u/4532842/blog/5172639
33. Dapr 部署
https://github.com/second-state/dapr-wasm
34. Dapr 上部署的微服务
https://www.secondstate.io/articles/dapr-wasmedge-webassembly/
35. Kubernetes 上部署
https://www.secondstate.io/articles/manage-webassembly-apps-in-wasmedge-using-docker-tools/
36. 了解更多
https://github.com/WasmEdge/WasmEdge
37.