A showcase of tools now available on the web thanks to WebAssembly.
WebAssembly enables developers to bring new performant functionality to the web from other languages. Over the past few years developers have really taken advantage of the possibilities. This post showcases just a few of the shiny new tools that you can benefit from, thanks in part to WebAssembly.
Tools and libraries you can use now
Without further ado, let's jump into the good stuff :D
SQLite
This complete port of SQLite brings a lightweight, embedded, relational database management system into your hands. To learn more read this blog post that showcases this incredible port and how to use it.
FFmpeg.wasm
FFmpeg is a free and open-source software project consisting of a suite of libraries and programs for handling video, audio, and other multimedia files and streams. You can find a wasm compiled version here (github repo) that lets you do all of this functionality directly in the browser.
Universal Scene Description (USD)
Universal Scene Description (USD) is a framework for 3D computer graphics data that focuses on collaboration, non-destructive editing, and enabling multiple views and opinions about graphics data. It's an industry standard supported by the likes of Pixar, Autodesk, Nvidia, and many more. It's still early days for their web support but Autodesk already open sourced a web based USD viewer which you can see here.
CanvasKit
CanvasKit is Skia, the rendering engine of Chrome and Android, compiled directly to WebAssembly. With it, you get simple JavaScript API access to practically all the power of the Skia rendering engine. The functionality includes complex rendering, text shaping, animation, inking, and more. Check out the npm package and quickstart guide.
TensorFlow.js
TensorFlow.js brings the power of TensorFlow directly into the browser with a simple JavaScript API. Under the hood, it optimizes models both across the GPU and CPU (including SIMD optimizations) to maximize performance. You can see the getting started guide or look at some of their demos directly.
OpenCV
OpenCV is an industry standard of programming functions mainly for real-time computer vision. There is an easy-to-use npm package here, and for Emscripten users there are also detailed instructions for doing a full build. For a look at how SIMD and threads are improving performance of these workloads, you can watch this section of the Modern WebAssembly Chrome Dev Summit talk.
Cocos
Cocos is a powerful and popular game engine that enables developers to build games with cross platform support and this now includes the web. It joins the long list of game engines that enable web export through wasm. To get started, jump into the Cocos editor and follow these instructions.
Conclusion
In addition to these specific examples, there is much to be excited about in terms of WebAssembly's potential to change the pace of new web functionality. Chrome has even set up the Advanced Web Apps Fund that can help developers fund their work to advance the web functionality available to all developers!
Hero image from Pexels, by Ann Marie Kennon.