September 25, 2024 ⏱️ 5 min
By Andrei N. (RnD – WebFrontend Group)
If you ever wondered when a groundbreaking technology will come into play to change the web world as we know it, here you have the answer: it’s already happening!
Developing web applications is not anymore just about the (basic) technologies of web development as we all know them (HTML, CSS, JavaScript). The game changer in this regard, the breaking technology, is called WebAssembly and it seems to rewrite the rules that governed the web development in the past decades.
Basics
The impact of WebAssembly is enormous, as it allows developers to break the limitations of traditional web development: developers can leverage their preferred programming languages and even existing codebases to develop powerful and efficient web applications.
WebAssembly is basically a type of code that can be run in the web browsers. It is a low-level assembly-like language with a compact binary format that runs with near-native performance and provides languages such as C#, Java, Python, Rust, Ruby etc. with a compilation target so that they can run on the web. It is also designed to run alongside JavaScript, allowing both to work together.
Last but not least, WebAssembly is W3C standard, which ensures it is a public & open technology, collaboratively built by and for the community. Here is a list of top 20 programming languages that support WebAssembly, together with the features they offer.
Browsers support
WebAssembly enjoys broad support from all major web browsers:
- Chrome
- Firefox
- Edge
- Safari
Additionally, it finds compatibility with server-side platforms such as Node.js. These factors highlight the extensive reach of WebAssembly as a powerful tool for building a wide range of web applications.
Portability
Besides browsers, WebAssembly is designed by nature to be portable across devices and operating systems, ensuring a consistent support regardless of the environment. Applications can be seamlessly accessed, making them more widely available and accessible to users. WebAssembly’s portability is a key factor in its growing importance in the world of web development.
Furthermore, irrespective of the host system (Linux, macOS, or Windows, etc.), WebAssembly exhibits hardware independence, offering developers the freedom to compile code on their preferred platforms.
Dive deeper
As already mentioned, WebAssembly is distinct in its nature as a low-level Assembly Language designed to closely resemble compiled machine code, optimizing performance. While developers won’t write code directly in WebAssembly, it serves as a compilation target for other languages. WebAssembly promises native-level performance, even when working with traditionally slower languages like Python or C#. This opens doors to new possibilities and performance optimizations.
How WebAssembly works for Web
In short, the code that a developer writes in his preferred language ends up in being executed by the browser, but in its own sandbox. This could be interpreted as a way to run untrusted code at the browser level, but since everything is sandboxed by the browser, it keeps the operating system safe.
On the other hand, WebAssembly cannot access directly platform-specific APIs that the browser exposes, unlike JavaScript. When running JavaScript in the browser, there is a set of Web APIs that the web app can directly call to control web browser/device functionality and access things like DOM, CSSOM, WebGL, IndexedDB, Web Audio API, etc. WebAssembly has access all these APIs too, but through JavaScript.
Technology: The Blazor case
As already stated above, developers who are creating apps based on WebAssembly are not writing code directly in WebAssembly. WebAssembly just serves as a compilation target for other languages. Thus, same as plain JavaScript is not used anymore to build modern enterprise web apps (basically developers use advanced frameworks as Angular or React), neither WebAssembly is used by developers to create web apps. In order create, pack and deliver real and modern apps the developers need a full technology/framework/ecosystem.
And so did Microsoft with Blazor, a technology marketed as being a full WebAssembly based which allows “the power of .NET and C# to build full stack web apps without writing a line of JavaScript.”. Starting with NET8 release, in November 2023, Blazor got a collection of features which made it evolve from “a niche .
NET framework” to “modern web framework—and beyond”.
In order to understand more regarding the impact that Blazor generated on the market together with the release of NET8, you can read this comprehensive article written by Ed Charbeneau (Developer Advocate for Telerik).
Performance use case: Figma
Since one of the key features that WebAssembly claims to offer when it comes to web apps is the performance, we can’t fail to mention Figma as an example of a web service that has already embraced WebAssembly (since 2017!). The graphics code of the core Figma editor is written in C++, and compiled to WebAssembly.
Here is the full story, told directly by a co-founder of Figma: “WebAssembly cut Figma’s load time by 3x”.
Will WebAssembly replace JavaScript?
Although WebAssembly was initially meant to be a technology for the web (as the name stands), it was never designed to replace JavaScript. But rather to be used in collaboration with it. In the end, JavaScript (the only one able to manipulate the DOM) is one of the core technologies of the web, since the inception of what we know as the World Wide Web, and powers more than 90% of websites on the client side for webpage behavior.
Developers will be adopting WebAssembly especially for performance-intensive use cases like video editing, CAD Applications, gaming (which are intensive in terms of heavy graphics) and music streaming. So, at least for some time, WebAssembly and JavaScript will coexist and will empower each other.
Future Outlook
WebAssembly’s potential does not stop only on Web Frontend. WebAssembly is already revolutionizing the backend development as well. Cloud providers have already noticed its potential, and started to integrate support into their services and runtime environments as well. For instance, AWS Lambda now supports WebAssembly and developers can now deploy functions in languages like Rust or C, alongside with traditional languages. Also, Azure Functions (Microsoft’s serverless compute service) has incorporated WASM support to enhance language flexibility and runtime efficiency in building serverless applications.