Quick Tip: Try WebAssembly in Your Browser Today

Share this article

In June 2015, inventor of JavaScript and co-founder of Mozilla, Brendan Eich, announced something very exciting for the web: WebAssembly.

Eich explains that JavaScript has been dubbed as the assembly language of the web, something which he disagrees on and goes on to introduce WebAssembly, “a new intermediate representation for safe code on the Web“, as he describes it. Google, Microsoft, Mozilla, Apple and some other folks have been experimenting on it before Eich’s announcement.

WebAssembly, “wasm” for short, .wasm filename suffix, is an emerging standard whose goal is to define a safe, portable, size- and load-time efficient binary compiler target which offers near-native performance—a virtual CPU for the Web.

Why the need for WebAssembly? Well, asm.js requires the engines to optimize for it, making the parser the hot spot (literally – mobile devices can get really hot). This is due to the need for transport compression which also saves bandwidth, but decompressing it before parsing can be painful. Also, once browsers support the WebAssembly format natively, JavaScript and wasm can diverge, without introducing unsafe or inappropriate features into JavaScript just for use by compilers sourcing a few radically different programming languages.

Auth0 explains WebAssembly pretty well in this post, if you need a better overview.

WebAssembly – One Year Later

WebAssembly is designed with several use cases in mind, inside and outside the browser. As you can guess, wasm can be used for image/video editing, AAA games in the browser, live augmentation, Virtual Reality and so much more. Pretty much everything that is already possible on the web, but with the potential to be faster and more efficient. But WebAssembly can be also useful outside the browser: server side applications, hybrid native apps, server side computing of untrusted code are just some of the potential applications.

The roadmap is also going well. In the last year, the WebAssembly Community Group has made a great amount of progress, producing:

  • A description and rationale of the initial feature set and planned future features;
  • A specification and reference interpreter;
  • 13,000 lines of tests used to validate both the spec interpreter and browsers;
  • A first draft of the binary format.

With such exciting promises, browser vendors have been hurrying to offer early WebAssembly implementations in their browser engines. It’s now possible to build WebAssembly demos that run on multiple experimental implementations.

Why experimental? This is due to both the binary format and JavaScript’s bindings for WebAssembly likely changing incompatibly over the coming months, until the first stable release. Implementations are not expected to be mature enough for stress tests or bench-marking yet and for some time to come.

However, this is a big leap forward as all browsers are getting on the same page, which is wonderful when you think of what things Internet Explorer has been doing in the past.

Have a read through the Mozilla Hacks WebAssembly article for further details.

WebAssembly Demo

Let’s try out the WebAssembly Demo via Firefox Nightly (it should also work on Chrome Canary). Make sure you have a latest version of Nightly installed, open about:config and set javascript.options.wasm to true.

Screenshot of the Angry Bots game

Check out this experimental demo of Angry Bots, a Unity game which has been ported to WebAssembly. You can fight robots and explore a 3D space station in this top-down shooter. Movement is controlled by W, A, S, D or the arrow keys and aiming & firing is controlled by the mouse.

Coming Next

There are still major tasks ahead for WebAssembly before a first stable edition is released:

  • The official WebAssembly text format needs to be defined.
  • Further reduce binary format size.
  • Iterate on the WebAssembly JavaScript API.
  • More approachable documentation for compiler writers, tool authors, hackers, and students.
  • More tests added to the test suite.

Web, Assemble!

If you want to get involved, you can join the community group on W3C. The actual WebAssembly specification is being developed in the spec repository on GitHub. The group suggests that high-level design discussions should continue to be held in the design repository, via issues and pull requests. Before you dive in, make sure to read through the Code of Ethics and Professional Conduct as well.

Excited yet? What do you think of the latest news about WebAssembly?

Elio QoshiElio Qoshi
View Author

Elio is a open source designer and founder of Ura Design. He coordinates community initiatives at SitePoint as well. Further, as a board member at Open Labs Hackerspace, he promotes free software and open source locally and regionally. Elio founded the Open Design team at Mozilla and is a Creative Lead at Glucosio and Visual Designer at The Tor Project. He co-organizes OSCAL and gives talks as a Mozilla Tech Speaker at various conferences. When he doesn’t write for SitePoint, he scribbles his musings on his personal blog.

asm.jsmodernjs-tutorialsnilsonjquick-tipWebAssembly
Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week