在线咨询

添加金飞科技微信

微信咨询

添加金飞科技企业微信

企业微信

电话沟通

132-5355-1112

电话咨询
WebAssembly 概念
日期:2024-10-08

WebAssembly 是什么?

WebAssembly 是一种运行在现代 web 浏览器中的新型代码,并且提供新的性能特性,同时提升了性能。它设计的目的不是为了手写代码,而是为诸如 C、C++ 和 Rust 等源语言提供一个有效的编译目标。

对于 Web 平台而言,这具有巨大的意义——这为客户端 App 提供了一种在 Web 平台以接近本地速度的方式运行多种语言编写的代码的方式;在这之前,客户端 App 是不可能做到的。

而且,你在不知道如何编写 WebAssembly 代码的情况下就可以使用它。WebAssembly 的模块可以被导入的到一个 Web App(或 Node.js)中,并且暴露出供 JavaScript 使用的 WebAssembly 函数。JavaScript 框架不但可以使用 WebAssembly 获得巨大性能优势和新特性,而且还能使得各种功能保持对网络开发者的易用性。

WebAssembly 关键概念

为了理解 WebAssembly 如何在浏览器中运行,需要了解几个关键概念。所有这些概念在 WebAssembly JavaScript API 中都存在一一映射。

  • 模块:表示一个已经被浏览器编译为可执行机器码的 WebAssembly 二进制代码。一个模块是无状态的,并且像一个二进制大对象(Blob)一样在 Window 和 Worker 之间进行共享(通过 postMessage() 函数)。一个模块能够像一个 ES 的模块一样声明导入和导出。
  • 内存:一个可变长的 ArrayBuffer。本质上是连续的字节数组,WebAssembly 的低级内存存取指令可以对它进行读写操作。
  • 表格:一个可变长的类型化数组。表格中的项存储了不能作为原始字节存储在内存里的对象的引用(为了安全和可移植性的原因)。
  • 实例:一个模块及其在运行时使用的所有状态,包括内存、表格和一系列导入值。一个实例就像一个已经被加载到一个拥有一组特定导入的特定的全局变量的 ES 模块。

JavaScript API 为开发者提供了创建模块、内存、表格和实例的能力。给定一个 WebAssembly 实例,JavaScript 代码能够调用普通 JavaScript 函数暴露出来的导出代码。通过把 JavaScript 函数导入到 WebAssembly 实例中,任意的 JavaScript 函数都能被 WebAssembly 代码同步调用。

因为 JavaScript 能够完全控制 WebAssembly 代码如何下载、编译运行,所以,JavaScript 开发者甚至可以把 WebAssembly 想象成一个高效地生成高性能函数的 JavaScript 特性。

将来,WebAssembly 模块将会像 ES 模块那样加载(使用 <script type='module'>),这也就意味着 JavaScript 代码能够像轻松地使用一个 ES 模块那样来获取、编译和导入一个 WebAssembly 模块。

如何在我的 app 中使用 WebAssembly?

上面我们讨论了 WebAssembly 向网络平台增加的基本要素:代码的二进制格式、加载运行该二进制代码的 API。现在让我们讨论如何在实践中使用这些基本要素。

WebAssembly 生态系统处在初始阶段;更多的工具会毫无疑问得不断出现。当前,有四个主要的着手点:

  • 使用 Emscripten 移植一个 C/C++ 应用程序。
  • 直接在汇编层,编写或生成 WebAssembly 代码。
  • 编写 Rust 程序,将 WebAssembly 作为它的输出。
  • 使用 AssemblyScript,它类似于 TypeScript 并且可编译成二进制 WebAssembly 代码。

让我们讨论

编写以 WebAssembly 为目标的 Rust 代码

在 Rust WebAssembly 工作组(Rust WebAssembly Working Group)的不懈努力下,编写 Rust 代码并编译到 WebAssembly 也成为可能。你可以在我们的从 Rust 编译到 WebAssembly 一文中开始安装必要的工具链,将 Rust 示例程序编译到 WebAssembly npm 包中,并在示例 Web 应用程序中使用。