You’ve most likely heard of Web Assembly. Maybe you’ve heard about how game-changing of a technology it is, and maybe you’ve heard about how it’s going to change the web.
Is it true? The answer to this question is not as simple as a yes or no, but we can definitely tell a lot as it’s been around for a while now. Since November 2017, Web Assembly has been supported in all major browsers, and even mobile web browsers for iOS and Android.
In this article, I’ll explain what Web Assembly is, how it works, what are the advantages, and what are the current uses today.
So with that being said, let’s get started!
Let’s take a look at how MDN explains it:
We can learn a few important things from their explanation:
First, Web Assembly (or, WASM for short) is not a language you write, but a compilation result of other languages. Here’s a list of all the languages that support compilation to WASM: https://github.com/appcypher/awesome-wasm-langs
You’ll probably be surprised to find out you can even use TypeScript syntax to write Assembly, using AssemblyScript.
Second, WASM is faster than JS and runs with near-native performance in the browser. This is a big deal and is what makes WASM so attractive.
WASM and JS can even communicate with each other. So WASM code has the ability to indirectly access JS features such as different features of the Web API like the DOM, Audio, Web Sockets, etc.
So by now you probably get that WASM is fast, but why? How does it actually work?
In order to understand that, first you’ll need to understand how the JS engine works behind the scenes. Since this is not the main topic of the article, I’ll only touch on it from a high-level. I explained it much more deeply in my article about how the JS engine works, and I highly recommend to read it first if you’re not familiar with the subject at all.
Also keep in mind that engine implementations are different, the steps I’m explaining here are about how V8 works, but other engines might do this differently.
In order to compile JS code there are few things the engine must do:
The reason WASM is faster is because WASM code goes directly to the compiler, effectively skipping step 1 and 2.
But you might be wondering, why? Why is WASM able to skip steps 1 and 2 and JS not?
The reason for that is because JS is a dynamically-typed language, which means that JS checks the type of variables at run-time by the Parser.
In contrast, statically-typed languages require to declare the types in advance, therefore types are known and are checked at compile time.
So the way WASM works is:
But did WASM pass the test of time?
In 2019, researchers from Braunschweig in Germany looked at Alexa’s top 1 million websites and their use of Web Assembly. They wanted to see what WASM is being used for today.
They analyzed 947,407 websites and 3,465,320 pages. They found that 1,639 websites are loading 1,950 modules of WASM.
The two main uses of WASM were:
However, there are more uses for Web Assembly than just Gaming and Crypto Mining. In fact, Figma, a popular web designing tool, reported that they tripled their loading speed with WASM.
Fastq.bio reported they were able to improve performance by 20 fold. Autocad also used WASM and reported they were able to get native-like speed in the browser.
Web Assembly is definitely a revolutionary technology that allows running heavy software in the browser, something that was not possible before.
With that said, if you’re not trying to run super heavy computation then you probably don’t need to use WASM.
JS is still very fast and still dominates the browser, that doesn’t seem to change with the coming of WASM. Rather than replacing JS, WASM allows for better integrations, and software that uses WASM will most likely use JS too.