使用rust编译成WebAssembly(wasm)文件实践

0 点赞
0 条评论
3393 次浏览
发布于 2021-11-20 13:49

WebAssembly (以下简称WASM)最近听到最多的,相对比较火的一个技术,目前支持 WASM 的语言比较多,其中使用 Rust 开发在开发效率和便捷性、包体积大小等方面还是有很大优势的,非常方便,实际上官方周边文档已经比较全面和友好了,社区活跃度也非常高。

WebAssembly特点

1、运行高效,编译后的二进制文件wasm,js加载运行效率是js的10倍

2、跨平台,跟js是没有任何耦合关系,用时加载,可移植性非常强

3、可以解决js一些关键技术性能瓶颈的问题

4、安全

安装rust工具链

1、安装rust rust下载地址

2、安装wasm-pack

cargo install wasm-pack

3、安装过程中需要的C++库  Visual Studio下载地址 选择安装C++

4、安装过程中可能会出现如下报错信息,安装Perl并重新打开命令行工具就好了 Perl下载地址

error: failed to run custom build command for openssl-sys v0.x.xx

使用cargo创建一个rust项目

cargo new hello

修改 src/lib.rs 文件

extern crate wasm_bindgen;

use wasm_bindgen::prelude::*;

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

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

修改 Cargo.toml 文件

[package]
name = "hello"
version = "0.1.0"

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

[dependencies]
wasm-bindgen = "0.2"

编译成wasm

wasm-pack build

最终会在pkg目录下生成.wasm文件和其他文件

在JavaScript中调用

将hello_bg.js和hello_bg.wasm复制到项目中,然后调用

import('./hello_bg')
  .then((wasm) => {
    wasm.run('张三');
  });

OK成功~

文档

编译 Rust 为 WebAssembly

wasm-pack

Rust文档

版权所属:开发日记
转载时必须以链接形式注明原始出处及本声明。
"赞助我们,我们才能做的更多&更好"
赞助支持
还没有评论
写下你的评论...