5 Wasm Use Cases for Frontend Development
by @eleanorhecks@x.com (@designerlymag@x.com) on , tagged guest-posts, webassembly, security, performance (toot this?)
WebAssembly—or Wasm—is gaining ground as a frontend development option. How should you consider applying it?
1. Building Multiplayer Games
Multiplayer gaming keeps gaining popularity and shows no signs of slowing. What role does WebAssembly play in furthering the trend? Thanks to an option released in 2023, you can use it to create immersive, interesting, and highly interactive worlds for multiplayer gaming.
Ambient is a universal 3D runtime environment that will eventually work with any language that compiles or runs on Wasm. At the time of its release, Ambient was only Rust-compatible, but its developers intend to significantly expand its compatibility as soon as possible.
This game engine also has a data-driven design, within which information gets stored and interacted with via an entity components system supported by a centralized, server-located database.
If Ambient opens more development possibilities, users interested in gaming-related projects could increasingly see Wasm as a viable option to meet their needs and encourage them to explore different ways to use it.
2. Making Use of a Dedicated Platform for Frontend Developers in Government
Since WebAssembly is becoming a more popular choice for frontend developers, some decision-makers have built specialized platforms for those who want to use it—and other popular options—for their current or upcoming projects. One example came from leaders in a Norwegian government department who wanted to create a dedicated platform to meet its development team’s current and emerging needs.
It allows users to access a set of services to support their frontend workflows. The first option was a content delivery network, but there are now capabilities to support frontend logging, performance tracking, tracing, and more. Developers can also avail of feature management tools, including those that let them control feature toggles, such as to test functionality or roll back changes.
The Norwegian government authorities working on this project explored multiple emerging frontend technologies, allowing users to work within Wasm along with web components and OpenTelemetry. One primary goal was to help developers create services compatible with all frontend applications without limiting their technology choices.
Statistics show that web developers in the U.S. have median salaries of $61,016, and their earning potential rises with experience and skill growth. However, if employers follow the Norwegian government’s lead, development professionals could have enticing opportunities to use tech tools to support their tasks and facilitate their Wasm interactions.
Becoming more well-versed in WebAssembly could also allow you to command higher salaries, especially since frontend Wasm applications are becoming more common. The more diverse your skills, the more likely you can remain competitive in the job market and put yourself in an excellent position for promotions.
3. Bolstering Security Through Sandboxing
Cybersecurity is an ever-present concern for frontend developers. Consider, for example, that there were 5 billion malware attacks, including 493.3 million ransomware attacks and more than 300 thousand reports of phishing, in 2022 alone. Fortunately, Wasm aligns with security-related best practices because it can provide a sandboxed environment. More specifically, the execution for each WebAssembly module occurs within a sandbox and is separated from the host runtime.
Sandboxing allows you to safely utilize software plugins or third-party libraries by providing a lightweight way to run untrusted code in the same process as its environment. However, as researchers have pointed out, compiler bugs could compromise sandboxing protection. They surveyed the existing marketplace and identified a critical gap related to Wasm implementations that are simultaneously high-performing and sufficiently secure.
The team addressed that issue by building an open-source compiler that uses formal verification to prove a sandbox’s safety. Next, they created a compiler that gives informal proof of safety. The results showed that provable safety need not compromise runtime performance, particularly since one of the group’s tools was the first Wasm runtime to offer provably safe sandboxing and speed.
4. Achieving Better Performance and Faster Load Times
When you consider performance requirements for frontend applications, speed is often a top concern. Many users become impatient when applications load too slowly, even when their inadequate network connections are contributing factors.
However, Wasm is a good choice for frontend development applications because it can enhance performance. One reason for that benefit is that WebAssembly file sizes are smaller than their JavaScript counterparts. That advantage increases the user experience for individuals with low-bandwidth setups or slow network connections.
Additionally, WebAssembly has compact and optimized modules. Relatedly, downloading them with compression, streaming capabilities and in parallel. Then, execution occurs immediately after fetching.
Numerous tools exist to make frontend performance improvements for high compute workloads. They include Blazor, TinyGo, and WebAssembly Studio. These possibilities make Wasm more accessible to developers, which could encourage them to begin exploring how to use it.
5. Running Applications Through Web Browsers
WebAssembly also offers opportunities for you to allow users to run applications in web browsers. Such approaches reduce potential usage barriers by eliminating the need to install software, making experiences more convenient overall.
Developing with Wasm to run applications in web browsers is an option that goes beyond relatively small use cases. Some of the world’s most well-known applications have received increased features that way. One example occurred when Google Earth received new features and browser capabilities through development decisions made with Wasm. Streaming service Disney+ uses WebAssembly on the frontend, facilitating app updates and web deployments.
These high-profile examples should help you continue to see Wasm as a viable option for browser-based applications. Being open-minded about using it could make your workflows more productive while enabling better user-friendliness for those interacting with applications through their browsers.
WebAssembly: An Increasingly Appealing Frontend Option
The examples may show you that there are numerous compelling ways to use Wasm for frontend development. Everyone interested in taking this approach should continue paying attention to what other professionals try, since their efforts might inspire future applications and the ongoing growth of Wasm for frontend development.
(Frontend Dogma accepts guest posts as long as they aren’t AI-generated or promotional. Although guest posts are being reviewed, Frontend Dogma cannot and does not vouch for their accuracy, and does not endorse recommendations made in them.)