JavaScript and WASI - Simplifying the process even further

Hey Everyone,

I recently pushed an article providing a quick rundown of how you can compile your JavaScript Source Code to a WebAssembly Binary and then successfully executing it on Wasmtime(A Standalone Wasmtime Interpreter).

You can find the link to it here for references:
https://www.wasm.builders/deepanshu1484/javascript-and-wasi-24k8

With the Recent Release of Javy, there is now no need to use msgpack-tools as a dependency in order to provide input to be sent through stdin. Earlier, Javy Expected a msgpack input but now that is not the case.

In this BlogPost, I will iterate through this process of now how you can use it:

JavaScript Code Snippet

We will create a Simple JavaScript Program that will return us the Fibonacci Sequence of an Integer Input.

Create a file named index.js or you can name the file whatever you want. In my case, I have named it index.js

//Simple Program to calculate Fibonacci Sequence of an Integer Input
function fibonacci(num){
  var a = 1, b = 0, temp;

  while (num >= 0){
    temp = a;
    a = a + b;
    b = temp;
    num--;
  }
console.log("Fibonacci Term is ",b);

}

var Shopify = {
  main: fibonacci
};

Now, you might be wondering this is JavaScript Code and fibonacci function is also written in JavaScript as per the syntax but what is the role of this Shopify Object here.

Well the Javy Toolchain expects that our JavaScript code needs to define a global object where Shopify.main points to our main function. In this case I have defined my main function as fibonacci

Creating a WASM Binary out of the Source Code
STEP 1

Now, in order to create a WASM Binary out of the JavaScript source code, we will need our two weapons in hand Javy toolchain and msgpack-tools under our belt.

Navigate to /javy/target/release directory to generate the WASM Binary using the ./javy executable. You will have to save your JavaScript source code in this directory as well.

While installing javy you can also install it as a global dependency and then you won't need to navigate to this directory in order to make use of the executable. In my case, I haven't installed it globally that's why I have navigated to this directory.

./javy index.js -o index.wasm

After executing this command, you will have the WebAssembly Binary in your directory named index.wasm

Step 2:
After you have the WebAssembly Binary with you, you need to execute the following command in order to run it on the top of Wasmtime:

echo "10" | wasmtime run index.wasm

As of now the Default implementation of the Javy Toolchain does not allow the user to dynamically enter the input instead we have to directly serve it via command line arguments on the terminal.

That is why, we are explicitly appending echo "10" in order to append the value 10 to the fibonacci function argument. This value will get substituted in place of the num parameter which is present in the Fibonacci Function, and hence you will get the 10th Fibonacci Sequence as the Output.

STEP 3 :
Finally you will be able to see your Output displayed and working flawlessly on Wasmtime(which is a WASI Based Execution Engine)

Huge Shoutout to the Shopify Team for developing such a utility.