Topic 2-1. What is WebAssembly(WASM)?

WebAssembly is a new assembly language close to metal which is shared all types of major browsers.

It started as an upgrade to javascript, which is the only programming language on the web browser to be compiled on native level. However, all programming languages now try to support it to be compiled in the assembly language so that they can be compiled to the web without using javascript.

Rust is one of them but has more advantages than other languages with its memory-safe compiler without garbage collection. Compiled wasm from Rust has less wasm code and memory-safe on development.

To witness the power of WebAssembly in rust, check out

awesome-wasm

How to use wasm in rust

In this topic, we will make node package with wasm.

• Set nightly version as default

rustup default nightly

• Start new rust project with Cargo new wasm-tutorial

• Set Cargo.toml as below:

[package]
name = "wasm-tutorial"
version = "0.1.0"
authors = ["hskang9 <[email protected]>"]
edition = "2018"


[lib]
crate-type = ["cdylib"] // only static library is supported on wasm for now


[dependencies]
wasm-bindgen="0.2"

Bind wasm code to javascript

Building Javascript wrapper interface

To enable the functions created from the rust on browser, we need to build a wrapper interface to be run on js file. You can think of this as importing javascript function to rust file.

extern create wasm_bindgen;
use wasm_bindgen::prelude::*;

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

Producing Rust functions that Javascript can call

With wasm-bindgen, you can also export rust code with javascript functions.

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

Building wasm into node package that can be published

Now javascript is a compiled language with the wasm. build the package by running this command.

wasm-pack build 

Then go to pkg folder and you can use npm commands for this.

cd pkg/

npm publish --access=public