📜  WebAssembly-模块

📅  最后修改于: 2020-11-02 05:12:26             🧑  作者: Mango


我们已经看到了如何从c / C++代码获取.wasm文件。在本章中,我们将wasm转换为WebAssembly模块,并在浏览器中执行该模块。

让我们使用如下所示的C++阶乘代码-

int fact(int n) {
   if ((n==0)||(n==1))
      return 1;
   else
      return n*fact(n-1);
}

打开Wasm Explorer,可从https://mbebenita.github.io/WasmExplorer/获得,如下所示-

C++阶乘函数

第一列具有C++阶乘函数,第二列具有WebAssembly文本格式,最后一列具有x86汇编代码。

WebAssembly文本格式-

(module
   (table 0 anyfunc)
   (memory $0 1)
   (export "memory" (memory $0))
   (export "_Z4facti" (func $_Z4facti))
   (func $_Z4facti (; 0 ;) (param $0 i32) (result i32)
      (local $1 i32)
      (set_local $1
         (i32.const 1)
      )
      (block $label$0
         (br_if $label$0
            (i32.eq
               (i32.or
                  (get_local $0)
                  (i32.const 1)
               )
               (i32.const 1)
            )
         )
         (set_local $1
            (i32.const 1)
         )
         (loop $label$1
            (set_local $1
               (i32.mul
                  (get_local $0)
                  (get_local $1)
               )
            )
            (br_if $label$1
               (i32.ne
                  (i32.or
                     (tee_local $0
                        (i32.add
                           (get_local $0)
                           (i32.const -1)
                        )
                     )
                     (i32.const 1)
                  )
                  (i32.const 1)
               )
            )
         )
      )
      (get_local $1)
   )
)

C++函数事实已以WebAssembly Text格式导出为“ _Z4facti ”。

单击下载按钮以下载wasm代码,并将文件另存为factorial.wasm。

阶乘WASM

现在要将.wasm代码转换为模块,我们必须执行以下操作-

第1步

通过使用ArrayBuffer将.wasm转换为arraybuffer ArrayBuffer对象将返回一个固定长度的二进制数据缓冲区。

第2步

必须使用WebAssembly.compile(buffer)函数将ArrayBuffer中的字节编译为模块。

WebAssembly.compile()函数根据给定的字节编译并返回WebAssembly.Module。

这是在步骤1和2中讨论的Javascript代码。


代码说明

  • Javascript浏览器API提取用于获取factorial.wasm的内容。

  • 使用arrayBuffer()将内容转换为字节。

  • 通过调用WebAssembly.compile(mod)从字节创建模块。

  • 模块实例是使用new创建的

    WebAssembly.Instance(模块)

  • 使用WebAssembly.Module.exports()将阶乘函数导出_Z4facti分配给变量阶乘。

这是module.html和javascript代码-

module.html


      WebAssembly Module
   
   
      
   

输出

在浏览器中执行module.html查看输出-

执行模块HTML