一、WebAssembly 是什么?
“WebAssembly(缩写为 Wasm)是一种基于堆栈式虚拟机的二进制指令集。Wasm 被设计成为一种编程语言的可移植编译目标,并且可以通过将其部署在 Web 平台上,以便为客户端及服务端应用程序提供服务”
以上是 wasm
官网给出的一段解释。它运行在虚拟机中,执行的指令是虚拟指令,与汇编代码十分相似。WebAssembly
的名字可能也是由此而来(汇编语言的英文:Assembly)
通俗的讲,WebAssembly
是除 JavaScript
之外另一门可以在浏览器上运行的语言,其他语言(如 C/C++/Rust)也可以被编译成 WebAssembly
在浏览器上运行。WebAssembly
是静态类型的语言,可以以“接近原生”的速度运行代码。
- 2015 年 Mozilla 发布 WebAssembly 项目,随后 Google、Microsoft、Apple 等各大主流的浏览器厂商均大力支持;
- 2018 年 WebAssembly 第一个规范草案诞生;
- 2019 年成为 W3C 国际标准,成为与 HTML、CSS 和 JavaScript 并列的唯四前端技术;
- 2022 年 Docker 对 WebAssembly 提供支持;
二、为什么需要 WebAssembly?
WebAssembly
的出现,是为了解决 JavaScript
性能底下的问题!
随着 JavaScript
被广泛的应用,它也暴露了很多问题:
- 语法太灵活导致开发大型 Web 项目困难;
- 性能不能满足一些场景的需要;
这两大问题成为 JavaScript
头顶上的达摩克利斯之剑,危及着 JavaScript 更广泛的应用。
第一个问题,被微软的 TypeScript
解决了!微软利用 TypeScript
这把锋利的武器打造了 VSCode
等史诗级项目。
第二个问题,2008 年 Google 推出 JavaScript
引擎 V8
,使用 JIT
技术,使得 Web 性能得到了数十倍的增长。但 Web 性能还是被挑战!
- 由于 DOM 渲染和 JavaScript 执行相互独立,单线程导致 DOM 渲染阻塞 JavaScript 执行;
- 由于 JavaScript 是动态弱类型语言,而不像 C/C++ 这类静态强类型语言,JIT 优化效率有限;
为了进一步优化 JIT
效率,浏览器鼻祖 Mozilla 推出了 asm.js
,随后 Google、Microsoft、Apple 都觉得 asm.js
的思路不错,于是联合起来,一同共建 WebAssembly
生态。
WebAssembly
最大的优点是,可以大幅度提升 Web 应用的性能,执行速度和 C/C++
原生应用在一个数量级,据称优化后可以达到 C
语言程序 70% 的速度。
WebAssembly
的高性能、轻量和跨平台,使得我们可以将 C/C++
等语言运行在 Web,也可以将桌面端应用跑在 Web 容器。
三、浏览器兼容性
参见 https://developer.mozilla.org/zh-CN/docs/WebAssembly#浏览器兼容性
- Firefox 52+;
- Chrome 57+;
- Edge 16+;
- Safari 11+;
- Node 8+;
另外,微信小程序基础库版本从 2.13.0 开始,通过 WXWebAssembly
对象对集成的 wasm
包进行支持。
四、应用场景有哪些?
初期,主要用于浏览器性能敏感模块的实现,如复杂的界面渲染、游戏引擎、地图渲染,数学计算等。
过去几年发展很快,除了浏览器中可以跑,后端(Node.js
)也可以跑,在终端设备、移动设备、物联网及云原生上都有广阔的应用场景。
-
Figma 文件读取;
-
Magnum 跨平台的 OpenGL 图形引擎;
-
Google 3D 地图;
-
eBay 的条形码扫描仪;
-
AutoCAD 网页版;
-
Photoshop 网页版;
-
Web-DSP 在浏览器上运行的多媒体影音处理函数库;
-
Unity 的 Web 游戏引擎;
-
Egret Engine H5 游戏引擎;
-
Disney+ 应用程序开发工具包;
-
微软的飞行模拟器有一个基于 WebAssembly 的插件系统;
-
网页版 Windows 2000;
-
Blazor 让 .NET 代码在浏览器运行;
-
Walt 用 JavaScript 语法快速开发原生应用;
-
还包括语言检测、音频混合、视频编解码、数字信号处理、医学影像、物理模拟、加解密、压缩、数学计算等领域;
18个 WebAssembly
相关的创业公司:
五、如何使用 WebAssembly 进行开发
目前较为常见的是将 C/C++
代码或者是 Rust
代码转为 wasm
文件,另外也支持 Go
等语言。
参见:WebAssembly 中文网
参考:
- WebAssembly 中文网
- 《8个WebAssembly 应用案例》
- 《为什么说 WASM 是 Web 的未来》
- 《WebAssembly 用在了哪里?18个激动人心的 Wasm 初创公司》
- 《恕我直言,90% 的应用场景都不需要用WebAssembly!》