We take a look at the web API bringing the performance of compiled languages to the web.
WebAssembly (wasm) is different to other web APIs you might have played with. It’s a standard that defines a binary executable format for client-side applications on the web, which can be run in the browser while taking advantage of the speed and low-level hardware capabilities of machine code. While it’s a relatively new standard only now gaining attention, it’s already supported in all major browsers, and has a budding ecosystem of tools.
This represents a major change for the web, where JavaScript (or abstractions of it such as TypeScript) has been the only language available for coding. The introduction of WebAssembly means that there is now a platform to enable C, C++ and other code to be written and compiled to run in the browser.
In essence, if you write a wasm module, you compile it to a bytecode format, which can be executed on any platform that supports WebAssembly. This is similar to Java bytecode running on the JVM. You wouldn’t typically expect to write wasm code directly.
Need to build a site quickly, without the need for code? You need a website builder. Got a more complex site in mind? Get your web hosting right.
WebAssembly benefits
This is interesting for two reasons. First, it enables coding in languages other than JavaScript for the web. This is compelling to many developers who have stylistic preferences or experience in other languages. WebAssembly was originally designed to focus on C and C++ development, and it enables features of these languages, such as low-level memory management.
There’s support available for Rust, another language developed by Mozilla. However, it’s also expected that a wide range of languages and compilers will become available, and it will at some point introduce support for garbage-collected languages such as Java. You’ll find experimental compilers for other languages starting to become available.
Experiments show that WebAssembly code can be parsed significantly faster than JavaScript
The second benefit is performance. Experiments show that WebAssembly code can be parsed significantly faster than JavaScript (up to 20 times). This opens up the opportunity to develop more complex software for the web – things like 3D graphics engines, image processing and more.
Get the Creative Bloq Newsletter
Daily design news, reviews, how-tos and more, as picked by the editors.
As a result, one of the early emerging practical-use cases for WebAssembly is games developers looking to produce high-end games that run in browser. Epic Games has demonstrated a version of the Unreal Engine that runs in-browser as a wasm module.
WebAssembly is also designed to integrate with existing JavaScript engines, which mean the two platforms’ modules should be interoperable. Wasm modules can be imported into JavaScript code, which can then take advantage of its functionality. Currently WebAssembly cannot access the DOM or web APIs directly, but it can use JavaScript to do so.
Also, there’s nothing constraining WebAssembly to run only in-browser, and it’s expected it will be ported to other platforms. This could make it significantly easier to build cross-platform apps that support web and native environments.
Security implications
You might be wondering about the security implications of WebAssembly, since this is a general concern for low-level languages. Rather than being true native machine code, however, wasm is designed to execute in sandboxed environment, and adheres to the same security constraints as JavaScript does in browser.
If you want to get started with WebAssembly, Emscripten is a compiler that supports C and C++ compilation and conversion of existing applications. You won’t find too many production applications using it yet, but it represents another step to bridging the gap between browser and native software. This is definitely one to keep an eye on, and if you’re not building wasm modules, you could well be consuming them soon.
Building a site with a team? Keep your design files and notes safe in shared cloud storage.
Web design event Generate London returns on 19-21 September 2018, offering a packed schedule of industry-leading speakers, a full day of workshops and valuable networking opportunities – don’t miss it. Get your Generate ticket now.
Simon Jones is a technology leader with experience managing product and engineering teams of up to 200 staff, both at startups and large corporates. He is a proficient full-stack developer, in particular with Go & React + TypeScript. He now works at Facebook in London. Formerly CTO at Norwegian VC-backed startup Just, and Engineering Director at Barclays and American Express.
