Level Up with WebAssembly - Book Review and Q&A

Level Up with WebAssembly, by Robert Aboukhalil, self-describes as a practical book on building WebAssembly applications. The book is concise, example-packed, and implementation-oriented. The book shows approaches that have worked but also those that have failed, possibly saving developers time by avoiding dead ends.

Gabriel Cuvillier, senior software engineer at Continuation Labs, ported the iconic Doom 3 game to browsers with WebAssembly. Cuvillier said to InfoQ last year:

The web with WebAssembly is a difficult-to-learn technological stack, with rough edges and a fast-moving target. This last point may explain why it is still difficult to have an up-to-date, in-depth book about the platform. A lot can be done, but only with sufficient money/time/knowledge resources.

InfoQ reviewed the book and interviewed Robert Aboukhalil on the goals and contents of Level Up with WebAssembly.

InfoQ: Why did you write this book?

Robert Aboukhalil: A few years ago, I was porting a C library to the web and I came across WebAssembly. Although it seemed promising, I couldn’t figure out how to actually use it. Most online resources I found were either too simple (e.g. Hello World programs) or too complex (e.g. the internals of the gcc compiler). I just couldn’t find a practical guide on how to take an existing C library and compile it to WebAssembly.

After months of trial and error, I finally managed to port a few tools and integrate them into a web application. By then, I had compiled a long list of “recipes” I used to solve recurring issues. I figured I would save everyone else the trouble and write it all down in a book!

InfoQ: What is your target audience? What are the prerequisites in terms of knowledge? What should that audience be able to achieve after reading the book?

Aboukhalil: This book is for software engineers who want a practical guide to WebAssembly that focuses on concrete problem-solving. The only prerequisite is that you’ve written some JavaScript before, but knowledge of C/C++ is not required.

In the book, you learn to port C/C++ codebases to WebAssembly and to run them in the browser, or as serverless functions. Some of the tools we port include jq, awk, Pac-Man, and Tetris, just to name a few. We also cover the strategic aspects of when to use WebAssembly and just as importantly, when not to use it.

InfoQ: Level Up with WebAssembly comes in three versions, with a core content that can be extended with additional chapters by paying a higher price. In its core version, the book introduces WebAssembly, then quickly dives in the very first two chapters into writing a WebAssembly Hello world program. Chapter 3 skims through the benefits and use cases of WebAssembly, but also when not to use it. Chapters 4 to 10 run the reader through compiling existing C-based desktop software (with a short note on C++) to WebAssembly. While doing so, those chapters also discuss how to transfer to the web some particularly relevant aspects of desktop software: I/O, graphics, file persistence, and concurrency (through web workers). Concretely, the reader learns to compile to WebAssembly a command-line tool, a markdown parser, a JavaScript interpreter, and the Pong, Tetris, and PacMan games. Chapter 11 concludes with additional resources for the curious reader to further its knowledge of WebAssembly.

Given that most examples leverage C, how does the book’s advice translate for developers interested in targeting WebAssembly from Rust?

Aboukhalil: Aside from a few chapters that are language-agnostic, the book doesn’t cover Rust. When I started using WebAssembly, all the tools I wanted to port to the web were written in C/C++, so that naturally became the focus of the book. But if you’re interested in Rust and WebAssembly, I would recommend the aptly-named book Rust and WebAssembly.

InfoQ: Besides the core content, the Starter Kit version includes additional content about running WebAssembly code on serverless architectures, specifically within a Function-as-a-Service (FaaS) context. Practical examples tackle a range of platforms, including AWS Lambda, Google Cloud Functions, Azure Functions, Cloudflare Workers, and Fastly Lucet. How important is the serverless use case for WebAssembly? What are the tradeoffs for developers vs. running directly in the browser?

Aboukhalil: This is an exciting area because WebAssembly can drastically reduce how long it takes to spin up serverless functions. For example, Cloudflare runs your code inside Chrome V8 isolates, which allows them to sandbox users from each other without relying on bulky containers as other platforms do. Practically, this means their functions spin up in a few milliseconds instead of hundreds of milliseconds! Another provider to watch in this space is Fastly, whose platform runs your code directly inside a WebAssembly runtime (currently in private beta).

As for whether to run WebAssembly in a browser or a serverless function, that depends on your application. If you process data that is already on the cloud (as opposed to data on the user’s computer), or if you don’t want to run heavy analyses in the browser, serverless WebAssembly makes sense to use. On the other hand, if your app needs to work offline, if your UX would suffer from additional HTTP requests, or if you hit against serverless CPU/RAM limits, serverless WebAssembly might not be a good solution.

InfoQ: The Complete Edition includes 15 command line screencasts, a guide to porting UNIX tools to the web (awk, diff, and more), a detailed case study of performance improvement, and a Capstone project. The case study showcases a 9x improvement in speed that can be attributed purely to WebAssembly conversion. The Capstone project revolves around the implementation of an interactive data analysis tool running entirely in the browser (see illustration below). To do so, the reader will need to port the K-Means clustering C library to WebAssembly. What is the difficulty level of the Capstone project, assuming a reader who read the whole book?

Aboukhalil: The project ties together a lot of the material covered in the book: porting a tool from C to WebAssembly, passing complex objects from JavaScript to WebAssembly (in this case a 2D matrix of data points), mounting a local file to a virtual filesystem inside the browser, and running analyses in a WebWorker.

The project is representative of the challenges you’ll find in a real-world WebAssembly project, and if readers apply the lessons they learned from the book, they should be up to the challenge.

InfoQ: You mentioned in the book that the speed improvement linked to WebAssembly may vary across ports, even being negative in some occurrences. With your experience porting software to the web, what level of speed improvement do you believe is worth the effort of learning WebAssembly and its tooling?

Aboukhalil: That will depend on the problem you’re tackling. In some cases, I’ve seen order-of-magnitude speedups when using WebAssembly. For example, in one project, I replaced bioinformatics computations written in JavaScript with an off-the-shelf C tool that I compiled to WebAssembly and saw a 20X speedup.

But you’re not guaranteed to get speed improvements, and it’s important to note that performance isn’t the only reason to use WebAssembly. For example, I recently ported a bioinformatics library from C to WebAssembly and saw no speedup whatsoever. But it was still a win because the library in question was very complex, and the JavaScript alternative only has a fraction of the features.

When porting large codebases that have been battle-tested for years, simply being able to reuse that code can be more important than performance. And in some cases, JavaScript alternatives might not even exist.

About the Book Author

Robert Aboukhalil is the author of the book Level Up with WebAssembly, and is a Bioinformatics Software Engineer at Invitae, where he develops web applications for the interactive analysis and exploration of genomics data.