An introduction to WebAssembly
WebAssembly. While you may have heard of it, do you really know what it is? Knowing it was involved within the inner workings of our Video SDK here at Zoom, I decided to research and learn more about WebAssembly, also known as wasm. In this article, I'll walk you through my findings, in three main sections:
- A macro overview of wasm
- Exploring why wasm might be used
- Looking at Zoom's Video SDK's use of it
A high-level overview of WebAssembly
At its core, WebAssembly is a binary instruction set that allows for near-native computation speed. It is a low-level language that gives other languages like C#, C++, and Rust a target for compiling. In short, wasm allows low-level languages to run on the web at a fast speed. Products like WebAssembly are what allow us to have app-like experiences on the web (think photo editing straight from a website rather than a downloaded application).
Is this a Javascript replacement?
Good question. So good, in fact, that the wasm documentation has an incredibly thorough answer already written. For a TLDR, though, the answer is no. WebAssembly was created to work in tandem with Javascript, not take its place. Using both together allows you to create a Javascript application with the performance of WebAssembly. You could build a Javascript UI around a wasm canvas, or use WebAssembly modules within your application.
So why use it?
At the beginning of my research, it took me some time to understand why WebAssembly might be pulled into an application. Once I was clear on the power it provided, though, an answer became more obvious. Here are my favorite reasons:
Speed + Power
As mentioned before, WebAssembly runs at near-native speed. Think of editing photos within a PWA (progressive web app) at nearly the same speed you could do so on a native application (like a photo editor app on your smartphone). At one point, that was a laughed-at thought. But now it's possible, and that's thanks to tools like WebAssembly.
Easy to debug
With what it offers, you might think it'd be near impossible to peek inside and debug when necessary. But WebAssembly is "designed to be pretty-printed in a textual format (WebAssembly.org)". This means that it's readable and workable, making debugging possible.
Those are the ones that stood out to me, but if you venture over to wasm's documentation, you'll find even more reasons to try it out.
Zoom's Video SDK & WebAssembly
Zoom's Video SDK is a perfect example of harnessing the power of WebAssembly. It makes it easier to modify video streams in the browser and servers as a powerhouse for the SDK. While we don't see the WebAssembly code while using the Video SDK, we do work with it in the smallest way. When calling the init function, we pass through a second parameter that tells us where to find the WebAssembly assets for the Video SDK. For more information on this, see the Video SDK reference page.
Conclusion
Thank you for joining me to talk through WebAssembly! Researching this tool was a whirlwind that ended in joy, as I'm quite impressed with what it can do. For more information on wasm, look to its documentation on their site and MDN.