Rust 编写 WASM 入门

用 Rust 编写和编译 WASM

Hello world! 在今天的文章中，我们将讨论如何用 Rust 编写 WebAssembly 模块。 WebAssembly 是编程语言的可移植编译目标，能够方便地与 Web 上的 JavaScript 进行互操作。 Rust 能够利用这一点，使其对于许多场景都非常有用，例如：

• CPU 密集型工作负载（加密）
• GPU 密集型工作负载（图像/视频处理、图像识别）

本文将重点讨论编写可在后端使用的用于图像处理的 WASM 模块，以及探索编写和部署 WASM常见方法。

入门

首先，您需要安装 Rust。如果没有，您可以在here安装。

我们将重点尝试以三种不同的方式编写 WASM 模块：

• 使用 wasm-bindgen CLI
• 使用 wasm-pack
• 使用 napi-rs

首先将使用 wasm-bindgen-cli 创建应用程序，然后查看使用 wasm-pack 。本文的重点是创建一个简单的图像处理模块。字节数组操作和数据处理是 Rust 可以显着加快应用程序速度的领域。

在开始之前，请确保已安装 wasm32-unknown-unknown target。如果没有，可以像这样添加：

rustup target add wasm32-unknown-unknown

注意，为了尝试我们的模块，您还需要安装 npm （或其他替代方案）。

编写 WASM 模块

基础

为了设置项目，使用 cargo init --lib wasm-example 创建一个名为 wasm-example 的library项目。然后将使用以下代码安装依赖项：

cargo add wasm-bindgen@0.2.91
cargo add js-sys@0.3.68
cargo add image@0.24.9

还想将动态库 flag 添加到 Cargo.toml 文件中。通常，它让 Cargo 知道我们想要创建一个动态系统库 - 但当它与 WebAssembly 目标一起使用时，它只是意味着“创建一个没有 start 函数的 *.wasm 文件” 。为此，可以在下面添加这个小片段：

[lib]
crate-type = ["cdylib"]

Rust 中的 JavaScript 类型

为了能够在 Rust 中使用 JavaScript 类型，除了使用 wasm-bindgen 宏之外，还需要使用 extern C 。这允许直接从 JavaScript 导入函数到 Rust！

WASM 中的 Hello World 应用程序如下所示：

use wasm_bindgen::prelude::*;

#[wasm_bindgen]
extern "C" {
   
    fn alert(s: &str);
}

#[wasm_bindgen]
pub fn greet(name: &str) {
   
    alert(&format!("Hello, {}!", name));
}

注意，extern C 中的 alert 函数直接来自 JavaScript，并且允许我们在 Rust 函数中调用它。如果我们要编译它并在 JavaScript 文件中执行它，则与从常规 JavaScript 调用 alert() 相同。

我们可以应用相同的逻辑来处理其他类型和函数 - 即buffers。 JavaScript 中的 Vec<u8> 可以用以下两种方式之一表示：

• Uint8Array 类（ Vec<u8> 的直接 JavaScript 等价类型）
• Buffer 类型

Buffer 是 Uint8Array 的子类。这是因为当 Node.js 首次发布时，还没有 Uint8Array 类型 - 这就是导致创建 Buffer 类型的原因。后来，当 ES6 引入 Uint8Arrays 时，两者最终被合并，因为这样做是有意义的。许多 JavaScript 库仍然使用 Buffer 。通过使用 js-sys ，我们可以获得 JavaScript 和 Rust 之间的互操作性 - 通过定义 Buffer 类型并提供带有 buffer() 方法的方法，我们可以在下面看到这一点：

use js_sys::