riccardoravaro / assemblyscript

A TypeScript to WebAssembly compiler 🚀

AssemblyScript

AssemblyScript compiles strictly typed TypeScript (basically JavaScript with types) to WebAssembly using Binaryen. It generates lean and mean WebAssembly modules while being just an npm install away.

Try it out in WebAssembly Studio!

Motivation

Being able to write C-performance code in TypeScript feels so good – Ari on Slack (Apr 19, 2018)

Perhaps the fundamental issue [to get a small .wasm file] is that JavaScript is the only language for which the Web runtime is a perfect fit. Close relatives that were designed to compile to it, like TypeScript, can be very efficient as well. But languages like C, C++, Rust, and so forth were not originally designed for that purpose. – Alon Zakai, Small WebAssembly Binaries with Rust + Emscripten (Apr 18, 2018)

JavaScript's heyday as the only browser language is over, but most web developers are used to writing JavaScript, and learning a new syntax just to get access to WebAssembly is not (always) ideal. If only there was something in to bridge the gap… – Jani Tarvainen, TypeScript is the bridge between JavaScript and WebAssembly (Feb 20, 2018)

I do think [compiling TypeScript into WASM] is tremendously useful. It allows JavaScript developers to create WASM modules without having to learn C. – Colin Eberhardt, Exploring different approaches to building WebAssembly modules (Oct 17, 2017)

Getting started

All the details are provided in the AssemblyScript wiki - make sure to pay it a visit. With that being said, the easiest way to get started with AssemblyScript is to point npm at the GitHub repository (for now)

$> npm install --save-dev AssemblyScript/assemblyscript

followed by scaffolding a new project including the necessary configuration files, for example in the current directory:

$> npx asinit .

Once the project is set up, it's just a matter of using your existing TypeScript tooling while coding, and using the CLI to build to WebAssembly, either manually, or using (and maybe modifying) the generated build task in the generated package.json:

$> npm run asbuild

The CLI API can also be used programmatically.

If you rather prefer an installation suitable for development, pretty much the same can be achieved by cloning the GitHub repository instead:

$> git clone https://github.com/AssemblyScript/assemblyscript.git
$> cd assemblyscript
$> npm install
$> npm link

Note that a fresh clone of the compiler will use the distribution files in dist/, but it can also run the sources directly through ts-node after an npm run clean, which is useful in development. This condition can also be checked by running asc -v (it is running the sources if it states -dev).

Examples

• Conway's Game of Life [ demo | fiddle ]
  Continuously updates the cellular automaton and visualizes its state on a canvas.

• Mandelbrot Set [ demo | fiddle ]
  Renders the Mandelbrot set to a canvas.

• i64 polyfill
  Exposes WebAssembly's i64 operations to JavaScript using 32-bit integers (low and high bits).

• PSON decoder
  A simple decoder for the PSON binary format.

• WASM parser
  A WebAssembly binary parser in WebAssembly.

• N-body system [ demo ]
  An implementation of the N-body system from the Computer Language Benchmarks Game.

Building

To build an UMD bundle to dist/assemblyscript.js (depends on binaryen.js), including a browser version of asc to dist/asc.js (depends on assemblyscript.js):

$> npm run build

Cleaning the distribution files (again):

$> npm run clean

Linting potential changes:

$> npm run lint

Running the tests:

$> npm test

Running everything in order (lint, clean, test, build, test):

$> npm run all