WebAssembly: The future of web platform
While Javascript was ruling the web platform, a new innovation marked the beginning of the advanced technological era. Since 1995, when JavaScript was introduced by Netscape, the great Javascript has been the only option available for a programmer to realize performing programs in the browser. With modern updates making a way into the web world, one such innovation gained ground and is called the WebAssembly.
Before exploring what WebAssembly is, the advantages, and how it is useful, here is another functionality that is closely associated with the WebAssembly, called LLVM. WebAssembly (abbreviated Wasm) and LLVM together are responsible for the binary instruction format for the stack-based virtual machines.
Below is a visual representation of the WebAssembly and its operation.
In simple terms, WebAssembly is an improvement of Javascript that helps to interoperate with other languages like Rust, C, C++, etc. And, it aims to enable high-performance applications on the web without compromising safety and portability.
WebAssembly also overcomes the challenges posed by Java Applet and Flash from the past like poor integration with the browsers, additional run-time and plug in requirements, and security concerns.
What makes WebAssembly stand out?
WebAssembly is not a replacement for Javascript. It is designed to complement JavaScript and is meant to function in the same ecosystem as that of JavaScript.
Here is an illustration of the WebAssembly flow, an excerpt from the above video.
- The programmer can craft a code in a language of their choice. Rust is recommended.
- Then they can annotate the functions that they want to export and import.
- The Rust ecosystem can be requested to emit a binary code. The Rust compiler and LLVM work together to generate .wasm.
- Then the WebAssembly is ready to be fully functional.
- The JavaScript fetches this binary and instantiates the WebAssembly.
- The next step is to export the function and work on the results.
How is a .wasm file generated?
The creation of a .wasm file is an interesting subject in itself, despite the existence of differences in terms of Target Platforms, Instruction Set Architecture and Operating Systems.
For example;
- There is a Rust code that needs to be executed in a machine whose ISA is AMD/Intel x86_64 and the platform is Linux-gnu.
- Then there is another order and this code needs to run on a Mac whose ISA may be x86_64 and the OS is darwin. In Rust parlance, a target is defined as a combination of ISA-Vendor-OS.
- All that is needed in Rust is to pass a few configuration information to the Rust ecosystem indicating the required target and it becomes extremely easy to obtain an executable or .so file, in ELF format, suitable for the Linux Target or dylib in Mach-O format or .dll for Windows.
Thus, the visible piece of the Rust ecosystem, to a programmer, in the whole process is the rust compiler.
How does Rust overcome complexity & inefficiency?
The process of creating a machine-understandable code is a two-phase activity:
Compilers like Rust/Swift/C++/Kotlin and many others perform the frontend job of enforcing their language-specific rules on the source code to produce an LLVM Intermediate Representation. The LLVM backend takes this IR to produce a machine code that is understandable by the target. Thus, your compiled code, whether it is an executable or a shared library, becomes language-agnostic when it is represented in the Intermediate Representation.
Thus WebAssembly is considered a Virtual Instruction Set Architecture and applies this idea of cross-compilation to emit a platform-agnostic Intermediate Representation. Interestingly the target triple for this in Rust is wasm32-unknown-unknown. Where “unknown” should be read as “independent of”. It is independent of the Vendor and Independent of the Operating System. The .wasm file is thus language agnostic. And most importantly, the .wasm file can run in all the aforesaid browsers side-by-side with JavaScript.
What are the advantages of WebAssembly?
1. Quick Performance
Unlike the Just-in-Time JavaScript compiler, that spends time on a series of tasks involving parsing, compiling, coercing the type, optimizing and reoptimizing the code every time, the WebAssembly is faster than JavaScript, because it is precompiled and optimized ahead of time into an intermediate representation. This intermediate representation is relatively closer to the target machine code than the Javascript source.
2. Security
Security is the most important vector for any web application. The main storage of a WebAssembly is a large array of bytes called linear memory. The linear memory is disjoint from the code space and the execution stack. This insulates the compiled program from corrupting the execution environment by jumping to arbitrary locations to open gates for compromising security.
3. Maintainability
WebAssemblies, though are language agnostic, the process of building using Rust bestows all the benefits which complement JavaScript. The important benefits are TypeSafety, improved testability, and improved predictability to the performance. Overall, WebAssembly helps to improve the maintainability of the Web Application.
4. Cost Efficiency
WebAssembly helps to move portions of the heavy-duty operations that are being performed at the Server-Side to the Browser. This will help in reducing the total cost of ownership by freeing up the server resources and in reducing I/O overheads.
The founding pillars of software engineering are the programmers, their algorithm, their application of coding skills. These are the vital drivers that make an application better in every dimension. And, a language like Rust combined with ideas like WebAssembly enables JavaScript and Web application in achieving a blazingly fast and highly maintainable application. Together, this combination becomes a sign of breakthrough innovation and progress.