Skip to content 2.0

JavaScript and WebAssembly for Micro-frontends

Author: Natalia Venditto

Date First Published: Wed Jan 04 2023

What is WebAssembly aka Wasm?

What is Wasm or WebAssembly?

WebAssembly is binary format compilation target or low-level code that can be packaged into quite small modules with the file extension ´.wasm´, which is the reason why is known also as Wasm.

But there is a lot more! It is portable, and can run also in the server and other devices. It can be compiled to modules, that can be integrated to JavaScript applications for tasks that JavaScript may not be very efficient at.

In sum, this is a very broad, complex and extensive topic, and because of that, I’m dedicating several pages to Wasm and JavaScript and how it applies to composable decoupled frontends that you can read here.

In this page and the next couple of, we will deep dive into the core concepts of this technology, and why it’s important in the current composability landscape. Do we need Wasm to build more efficient micro-architectures? I believe, yes, we do. And I will try to explain here why.

My story with WebAssembly

I first heard about WebAssembly at the end of 2016, but I later learned it was born one year earlier. At the time, I was working as a Senior Frontend Software Egnineer and was very much into Web Performance. I was preparing a talk about http/2 to convince the people running systems and architecture in the company I worked at, to flip the switch for our servers, and while investigating about performance improvements, I came across WebAssembly.

At that time, WebAssembly core features were already available in a lot of the browsers we needed to support. So it was potentially interesting. But I was too busy with JavaScript, and did not pay it much attention.