[WASM] Create and Run a Native WebAssembly Function
In this introduction, we show a simple WebAssembly function that returns the square root of a number. To create this function we load up WebAssembly Explorer (https://mbebenita.github.io/WasmExplorer/), writing the native WAST code to create and export the function. We compile and download the resulting WebAssembly binary, loading this with the Fetch API and WebAssembly JavaScript API to call the function in the browser.
Demo Repo: https://github.com/guybedford/wasm-intro
(module
)
Define a function inside the module:
(module
(func $sqrt
)
)
Now we defined a empty function,
To add input and output we can do:
(module
(func $sqrt
(param $num f32) # Input: param is the keyword, $num is the param name, f32 is the type
(result f32) # Output: result is the keyword, f32 is the type
)
)
Now we can define function body:
(module (func $sqrt (param $num f32) (result f32) (f32.sqrt (get_local $num)) # call the function sqrt on f32, pass in the params $num though get_local function ) )
The calculation value will be the return value.
If we want to use the fucntion in Javascript, we need to export the function:
(module (export "sqrt" (func $sqrt)) # export the function call "sqrt" refer to $sqrt function we defined below (func $sqrt (param $num f32) (result f32) (f32.sqrt (get_local $num)) ) )
After "Assemble" it and "Download" the file, we can load in the project:
<!doctype> <html> <header> <title> WASM </title> <script> fetch('./test.wasm') .then((res) => { if(res.ok){ return res.arrayBuffer(); } throw new Error('Unable to fetch WASM') }) .then((bytes)=> { return WebAssembly.compile(bytes); }) .then(module => { return WebAssembly.instantiate(module); }) .then(instance => { window.wasmSqrt =instance.exports.sqrt; }) </script> </header> </html>
Open the console, we can type:
wasmSqrt(25) //5
相关文章
- go中的fatal error:concurrent map read and map write
- ORA-31480: staging database and source database cannot be the same ORACLE 报错 故障修复 远程处理
- ORA-31498: description and remove_description cannot both be specified ORACLE 报错 故障修复 远程处理
- MySQL Error number: 3088; Symbol: ER_MIX_OF_GROUP_FUNC_AND_FIELDS_V2; SQLSTATE: HY000 报错 故障修复 远程处理
- MySQL Error number: 3682; Symbol: ER_ONLY_IMPLEMENTED_FOR_SRID_0_AND_4326; SQLSTATE: 22S00 报错 故障修复 远程处理
- ORA-54655: CREATE_TIN: scratch tables/views(string) exist and need to be dropped ORACLE 报错 故障修复 远程处理
- ORA-01296: character set mismatch between dictionary string and logfiles ORACLE 报错 故障修复 远程处理
- ORA-13062: topology IDs do not match in the feature table and the topology ORACLE 报错 故障修复 远程处理
- ORA-13769: Snapshots string and string do not exist. ORACLE 报错 故障修复 远程处理
- ORA-14161: subpartition number string: sum of PCTUSED and PCTFREE may not exceed 100 ORACLE 报错 故障修复 远程处理
- ORA-14530: row mismatches found in table string.string and index string.string ORACLE 报错 故障修复 远程处理
- Akka(22): Stream:实时操控:动态管道连接-MergeHub,BroadcastHub and PartitionHub详解编程语言
- Oracle between and 边界问题详解编程语言
- MySQL中的OR与AND操作符比较(mysqlor和and)
- Linux Stable kernels 4.8.10 and 4.4.34 发布
- Finding and Managing Oracle Constraints(oracle查找约束)
- 条件MySQL 子句之间`AND`操作符多条件查询(mysql多个and)
- MySQL中AND的使用方法解析(mysql中and的用法)