你还在用webpack引入rust-wasm吗???我来教你纯原生的玩法~

142 阅读1分钟

rust的编译为webAssembly越来成为行业规范,虽然webAssembly还颇具年轻,但在网络安全,3D渲染上已经展露头角。学习rust已经成为了构建前端工具链乃至前端性能优化上不可忽视的重要选择。 在mdn中,详细讲述了如何使用wasm-bindgen构建JavaScript与Rust编译为webAssembly的桥梁。

编译 Rust 为 WebAssembly - WebAssembly | MDN

文章将采用发布npm包加使用webpack搭建服务器的方式完成页面。本文将拓开眼界,回归轻量,教给大家如何在本地,不发布npm包,不使用webpack的方式。来完成整个项目的搭建。 废话不多说,公布答案~

<script type="module">
  // 引入打包后的computer.js包
  // init为wasm-bindgen构建的初始化函数
  // calculate_tax为rust编写的函数
  import init, { calculate_tax } from "./pkg/computer.js";
  async function run() {
    // 初始化WebAssembly模块
    await init(); 
    function calculateTax() {
      calculate_tax() // 直接调用就行
    }
  }
  run();
</script>

如果你已经跟着mdn上的文档敲过一遍了,那么这个就是你要的答案~ 文章末尾我在推荐一点好文:

Game = Rust + WebAssembly + 浏览器 (qq.com)
Rust 编译为WebAssembly 在前端项目中使用 (qq.com)

在推荐点文档:

Rust 和 WebAssembly --- Introduction - Rust and WebAssembly (rustwasm.github.io)
web_sys - Rust