js-wasm

docs.rs docs

JavaScript and WebAssembly should be a joy to use together.

This project aims to provide a simple, easy to learn, technology-agnostic way bridge the two worlds.

Use any WebAssembly programming language out of the box:

See a demo of it working!

How It Works?

Load WebAssembly like JavaScript.

<html>
    <head>
        <meta charset="utf-8">
        <script src="https://unpkg.com/js-wasm/js-wasm.js"></script>
        <script type="application/wasm" src="helloworld.wasm"></script>
    </head>
    <body>
        ...
    </body>
</html>

Create JavaScript functions and invoke them

Rust

[dependencies]
js = "0.3"
let fn_log = js!(
    "function(strPtr,strLen){
        console.log(this.readUtf8FromMemory(strPtr,strLen)); 
    }");

let msg = "Hello World!";

fn_log.invoke_2(msg.as_ptr() as u32, msg.len() as u32);

AssemblyScript:

import {js_register_function,js_invoke_function} from "./js-wasm"

let console_log_fn:f64 = 0;
export function console_log(msg: string) : void {
  if(console_log_fn === 0){
    const code = "function(msgPtr,msgLen){ console.log(this.readUtf16FromMemory(msgPtr,msgLen)); }";
    console_log_fn = <f64>js_register_function(<f64>changetype<usize>(code),<f64>code.length*2, 16);
  }
  js_invoke_2(<f64>console_log_fn,<f64>changetype<usize>(msg),<f64>msg.length*2);
}

export function main():void {
  console_log("Hello World!");
}

C/C++

#include "js-wasm.h"
 
char *code = "function(context,cstrPtr){\
        console.log(this.getCStringFromMemory(cstrPtr));\
    }";
JSFunction fnLog = js_register_function(code,strlen(code));

js_invoke_function_2(fnLog, "Hello World!");

In your JS function context this contains several functions handle most issues you’ll encounter

Name Description
readUtf8FromMemory(start,length) Extract utf-8 text from your program’s memory.
readUtf16FromMemory(start,length) Extract utf-16 text from your program’s memory.
writeUtf8ToMemory(str) Write utf-8 to a memory location you are sure it should go.
readCStringFromMemory(start,length) Extract C string text from your program’s memory.
writeCStringToMemory(str) Write C string to a memory location you are sure it should go.
readUint8ArrayFromMemory(start) Read a list of uint8 from a pointer to a location of a number of elements, followed by a pointer to bytes in memory.
storeObject(object) Store an object in your context for later reference, get a handle you can give to WebAssembly.
getObject(handle) Retreive and object from your context with a handle.
releaseObject(handle) Release a stored object so it’s memory can be freed.
createCallback(callbackHandle) Creates a callback function that will pass its arguments to the associated WebAssembly function represented by the handle.
module Get access to your program so you can call methods on it.

Who is making this?

My name is RICHΛRD ΛNΛYΛ, i’m a technologist from Portland, OR. I love the potential WebAssembly has for bringing powerful experiences to the world!

License

This project is licensed under either of

at your option.

Contribution

Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in js-wasm by you, as defined in the Apache-2.0 license, shall be dual licensed as above, without any additional terms or conditions.