The Wheel of WebAssembly
The Wheel of WebAssembly is a project aiming to show the diversity of languages that compile to WebAssembly. My initial idea was to define two functions in each language:
name()- returning the name of the language. This is used to render each part of the wheel.
feelingLucky()- returning a random integer between 1 and 100. This is used when the wheel is spinned.
In theory, when compiling each language, the output wasm file should be almost identical. In practice, this is not the case. As many of the compilers are still very experimental, these two functions cannot be definen in all the languages. Some have issues with generating a random number, so I import JavaSript's
- C / C++
Using Docker is the easiest way to get started. With Docker multi-stage builds for building each wheel part, the output image becomes around (only) 113MB. Each wheel part has a Dockerfile in its folder, so they all need to be combined into one global Dockerfile before building the image.
$> git clone https://github.com/boyanio/wasm-wheel.git $> cd wasm-wheel $> npm run build:dockerfile $> docker build . -t wasm-wheel $> docker run -p 8080:8080 -t wasm-wheel:latest
The basic requirement to set up the repository is Node.js. I have tested with version 8.9.1, but other (newer) versions would probably work as well.
$> git clone https://github.com/boyanio/wasm-wheel.git $> cd wasm-wheel $> npm install
Furthermore, each language has additional requirements.
Compiling wheel parts
Each wheel part represents a language that can be compiled to WebAssembly. My initial idea was to use toolchain to compile each source automatically, but this turned out to be a bit more complex. That is why I am putting here how each source can be compiled individually.
C / C++
Compiled by webassembly.
You would either need Mono or Visual Studio 2017+ installed on your machine to compile the source. Although Mono has an example of compiling C# directly to WebAssembly, the set-up is a bit more complicated. That is why I use Steve Sanderson's initial adjustment of DotNetAnywhere to interpret .NET into the browser. You would also need emscripten >= 1.38.12 to compile DotNetAnywhere's interpretter to WebAssembly.
AssemblyScript defines a subset of TypeScript that it compiles to WebAssembly.
You have to install the Rust toolchain by following these instructions. Afterwards you need to add the wasm32 target.
$> rustup update $> rustup target add wasm32-unknown-unknown
In order to compile Java into WebAssembly, I use TeaVM. The only thing you need is Maven - it will install its depedencies afterwards. You obviously need Java SDK as well.
Kotlin/Native v0.7.1 is used to compile Kotlin to WebAssembly. Compiling Kotlin to native restricts you from importing Java libraries. In order to generate random numbers, one may use C instead (as in the C wheel part), but this requires further configuration using the
As I don't need the
main function, I tried specifying
-nomain on the compiler, but it still throws an exception when initializing the WebAssembly module.
Build & Run
The following command will compile all sources to WASM and set up a HTTP server on port 8080. You can then access the site on
$> npm run build $> npm run serve
You can re-build individual wheel parts by running the following command:
$> npm run build -- [lang]
Questions & contribution
You can follow me on Twitter with @boyanio and ask me questions you might have. You can also open an issue here on GitHub. Pull requests are welcome, too :-)