Understanding WebAssembly

If I asked you which languages a web browser can natively interpret, chances are you'd answer: HTML, CSS and Javascript.

And you'd be right!

But what if I told you there's also a way to run code written in C/C++ or even Python directly in the browser? Well yes, it's possible thanks to a technology called Web Assembly.

What is it?

Web Assembly (or WASM) is a bytecode format specifically designed to be loaded, compiled and executed in a browser.

A bytecode is an intermediate language between uncompiled code (written by the developer), and machine code (executable).

The principle behind Web Assembly is therefore to take code written in a low-level language as input, in order to compile it into a bytecode that will be loaded into the browser, with an interface available so that Javascript and native code can communicate easily.

Once the bytecode is loaded, it will then be compiled into machine language and executed in a specialized sandbox within the web browser.

As you'll have understood, the main appeal of Web Assembly lies in its execution speed, since it is now possible to bring the execution speed of low-level languages directly into a web application.

In some cases, we can even achieve performance gains up to 16 times better than the execution speed of the same code in Javascript.

For those interested, here's a detailed benchmark of performance between Javascript and Web Assembly: https://link.medium.com/94HhoIRUZ9

What are the uses of Web Assembly?

The execution speed and memory optimization made possible by low-level tools allow us to take already very powerful web applications to the next level.

It is now possible to develop increasingly complex games that run directly in the browser, which is notably the case with Unity, which exports the browser version of its games in Web Assembly.

But it's also possible to do Edge Computing, meaning relieving servers by performing certain computations on the client's machine. This is the case, for example, for some image hosting services that perform compression of uploaded images directly in the browser.

And with Web Assembly, even video compression in the browser becomes possible!

And even though this technology is capable of many other things, we shouldn't forget that for some companies this also means being able to reuse a "legacy codebase" written in C in a browser without having to rewrite it in JavaScript!

How do you use it?

If you want to set up Web Assembly modules, I recommend reading these two tutorials to learn how to install and use Emscripten, the toolchain needed to compile C/C++ scripts into Web Assembly:

• Installing Emscripten: https://emscripten.org/docs/getting_started/downloads.html
• Compiling a C/C++ module: https://developer.mozilla.org/en-US/docs/WebAssembly/C_to_wasm