The world is gradually moving to web-based and browser applications and users don’t want to install a new app for every task they want to perform. Thus, many Rustaceans are interested in compiling parts of their projects or libraries to WebAssembly (Wasm) to make fast and reliable code available in any web browser.
Wasm aims to serve as a compile target for many high-performance programming languages including C, C++, and Rust. Rust and WebAssembly ecosystem is rapidly evolving now, you can learn more from the official documentation. This Rust web framework article also provides compelling insights on how to effectively use Rust in web development.
Our article answers a simple question, how do you compile Rust code to WebAssembly? Consider this as a Rust-Wasm tutorial. We’ll discuss common use cases for such compilation, help you prepare for it as well as share a few tips on the actual compilation process.
Why and when to compile a Rust project to WebAssembly
If you have any other programming experience, you might be wondering if it’s necessary to compile Rust code into WebAssembly. After all, wouldn’t it be easier just to use only one common web standard language like JavaScript? Unfortunately, JavaScript isn’t fast enough for high-performance systems. To get around common JavaScript limitations such as pauses during garbage collection, we need WebAssembly. However, WebAssembly isn’t here to completely substitute JavaScript on the web but rather add up to its powers, ensuring higher system performance and speed.
Despite obvious WebAssembly performance benefits, a 2022 research comparing the energy efficiency of JavaScript and WebAssembly proves that partially compiling code to WebAssembly can ensure your web application will consume significantly less energy.
You may consider compiling to WebAssembly only the most performance-critical parts of your Rust project so as not to make this process too time-consuming.
Here are some common use cases that describe when you may need to compile Rust to WebAssembly:
- You have an existing Rust project that you want to run in a browser
- You are writing a new application in Rust but want it to run on every platform (including mobile)
- The performance requirements are too high for JavaScript (e.g. games, machine learning, 3D visualizations, music synthesis)
- You want to use Rust’s memory safety and type system on the web
WebAssembly is designed to run at near-native speeds alongside JavaScript on the web. It’s much faster than JavaScript, with no runtime overheads. This makes it ideal for use cases like games and other performance-sensitive applications that need to run close to the metal.
Let’s switch from theory to practice and learn what you should do to prepare for compiling code from Rust to WebAssembly.
3 steps to prepare the working environment
To prepare for Rust to WebAssembly compilation, you’ll need to take a few steps. Let’s have a look at them.
Step 1. Install Rust and a wasm-pack tool. You’ll need Rust of the latest release with the tool rustup which helps you manage all the Rust versions. You’ll also need to work with rustc, a compiler for the Rust programming language, and Rust’s package manager, cargo. Before installing the full version of Rust, you can consider testing your skills in the Rust online compiler. A wasm-pack tool helps with building WebAssemebly packages that can be used alongside JavaScript in web workflows.
Step 2. Install JavaScript package manager. To make sure the compiled Rust code can be called from JavaScript, you’ll need its package manager, npm. Plus, the compiled Wasm code will have to be published in the npm registry.
Step 3. Create a Rust library project. For this, you need to create a new Cargo.toml file and put it in your current directory. You can edit this file to add dependencies and other information about your crate.
Once you have your working environment set up, we can proceed to actual compilation to WebAssembly.
Сonducting a successful compilation
This is a general overview of the Rust to WebAssembly compilation process, as it can differ from use case to use case.
- When we created our Rust project, we have a static library file, but to compile it to WebAssembly, we need to change it to a dynamic library format
- Then, via rustup, you’ll need to install the target for your Rust code, wasm2-unknown-unknown
- Now, using cargo, you can compile Rust source code into wasm binary
- With the help of the wasm-bindgen tool, you can generate JavaScript API to use with your compiled code
After all the code manipulations, we should get the final result that could be successfully published to npm and used on the web. Below is an example of the final compiled Wasm code from the Rust and WebAssembly book:
{
"name": "wasm-game-of-life",
"collaborators": [
"Your Name <your.email@example.com>"
],
"description": null,
"version": "0.1.0",
"license": null,
"repository": null,
"files": [
"wasm_game_of_life_bg.wasm",
"wasm_game_of_life.d.ts"
],
"main": "wasm_game_of_life.js",
"types": "wasm_game_of_life.d.ts"
}
Running the final code on a web page
When we finish the Rust code compilation to WebAssembly, we need to test it on the web. To simplify our lives, we can make use of the JavaScript template, create-wasm-app. After following the directions in this template, we can serve our code locally on the web.
If you want to compile Rust to WebAssembly, there are a few ways you can go about this. Choosing the right one will depend on your needs as a programmer and what types of programming environment you’re accustomed to using. In other words, it’s not an absolute "one-size-fits-all" solution. But if you put the tips we shared here to work for you, you’ll be well on your way to compiling Rust to WebAssembly in no time.
Rust’s future alongside WebAssembly ensures the best way to get your code into a browser without being held back by JavaScript. We are excited to see even more developers taking advantage of this technology as Rust gains in popularity and WebAssembly proves itself to be an integral part of the web. In the end, it’s up to you whether you want to use WebAssembly or not. However, it’s worth considering if it may be beneficial for your particular project.
No comments yet