DEV Community

Cover image for Exploring Rust for Web Development.
Mukhil Padmanabhan
Mukhil Padmanabhan

Posted on

111 4 6 8 11

Exploring Rust for Web Development.

As web applications become more and more complex, developers are constantly in the lookout for tools and technologies that can deliver higher performance, better security and greater maintainability. With JavaScript still dominating the front-end and powering many of today’s backends through Node.js, Rust has been described as a fast, reliable — yet productive and developer-friendly language.

I’ve been exploring Rust lately, and its potential in web development is fascinating. I might not expect to replace JavaScript wholly with it any time soon but it is definitely becoming a favourite candidate for performance-critical portions & creativity. In this article we’ll be looking at why that’s so, how we can integrate it with other web technologies such as WebAssembly (also known as wasm) then finally revealing a high-performance framework called Yew to make things event easier.


Why Rust Is Perfect for Web Development

1. Performance

Rust is a compiled language, which means it makes highly-optimized binaries. There are no interpreters generating low-level commands at runtime like JavaScript or Python. Rust code runs as fast as C and C++ do, which makes it suitable for any task that requires heavy computations or low latency.

2. Safety

My favorite feature of Rust is memory safety. All those bugs that crash your program because you tried to access an invalid pointer? They’re also compile-time errors in Rust! Buffer overflows? Compile-time error! You build web applications with Rust that are not only fast but also secure.

3. WebAssembly Support

Rust has first-class support for WebAssembly (Wasm): a binary instruction format that can be executed at near-native speed in modern web browsers. By using WebAssembly, you can write computationally intensive parts of your application in Rust, and then export them as JavaScript modules to be used wherever needed.


Use Cases

1. Performance-Critical Backends

Rust is gaining ground in developing the backend systems for which both performance and reliability are a priority. For example, one can develop highly scalable web APIs using Actix-web or Rocket.

Example:
Dropbox, to handle its file syncing on the backend, is using Rust due to performance and reliability improvements compared to their earlier setup.

2. Integrating Rust with WebAssembly

Imagine you’re building a web app that processes large datasets or handles real-time image manipulation. These tasks can bog down JavaScript. Rust, compiled to WebAssembly, can perform these operations efficiently, leaving JavaScript to manage UI updates.

Example:
Figma, a collaborative design tool, uses Rust and WebAssembly to power its graphics rendering engine, ensuring smooth interactions even with complex designs.

3. Frontend with Yew Framework

Rust’s Yew framework allows you to write web applications in Rust. It uses a virtual-dom, is inspired by Elm, and works similar to React.

For example, a start-up making a financial dashboard might use Yew for their frontend. They can have the performance and type safety of Rust for their critical computations as well as the smoothness of their UI.


How to Use Rust in Web Development

1. Setting Up Rust

Install Rust using the official Rustup tool:

Image description

2. Using Rust with WebAssembly

Rust’s integration with WebAssembly is seamless, thanks to tools like wasm-pack. Here’s a basic setup:

Install wasm-pack:

Image description

Create a new Rust project:

Image description

Add the wasm-bindgen crate to your Cargo.toml:

Image description

Build your project:

Image description

This generates WebAssembly files that you can import into your JavaScript application.

3. Building Frontend with Yew

To build a web app using Yew, follow these steps:

Install Trunk, a build tool for Yew:

Image description

Create a new Yew project:

Image description

Add Yew to your Cargo.toml:

Image description

Write your first Yew component:

Image description

Run your app:

Image description


Benefits of Using Rust for Web Development

Improved Performance: Rust’s compiled nature and Wasm integration make web apps faster and more efficient.

Enhanced Security: Memory safety and type checking help mitigate vulnerabilities.

Scalability: Frameworks like Actix-web ensure that your backend scales with your users' needs.
Developer Productivity: Due to Yew’s component based approach it is a lot easier to build complex UI’s.


Conclusion

Rust isn’t going to replace JavaScript or frameworks like React and Node.js. However, it is a powerful tool in your belt. It’s high performance, safety, and WebAssembly compatibility makes it a great choice for all performance critical parts of your app, backend systems, or even just playing around on the front end with something like Yew.

Web apps are only getting more complex. Rust ownership system will help you keep up with that complexity without pulling your hair out. If you’re building the next unicorn SaaS product or just trying to eek some extra optimization out of an existing app there is something for everyone in Rust.

Ready to give Rust a shot? Leave your thoughts or experiences in the comments. Happy coding!

Image of Datadog

The Future of AI, LLMs, and Observability on Google Cloud

Datadog sat down with Google’s Director of AI to discuss the current and future states of AI, ML, and LLMs on Google Cloud. Discover 7 key insights for technical leaders, covering everything from upskilling teams to observability best practices

Learn More

Top comments (14)

Collapse
 
sentinelaeux profile image
sentinelae

This is an absolutely awful idea for many reasons. WebAssembly is just a JS blackbox. Wasm is potentially faster due to it being able to abstract operations to its inner context, but unless you're going to reimplement everything related to render better than it currently is, which would defeat the whole purpose, since in this case things are way worse than doing things like a human being.
It all comes down to complexity versus features. You have way more features, way more mature, way more efficient, with way less complexity just by avoiding doing something like rust for webdev.
As much as people try to avoid HTML, CSS and JS, in the end that's all that matters in the web, no matter how bad are the choices behind. It's always simpler and better to just use HTML, CSS and JS.

Collapse
 
iannismccluskey profile image
iannismccluskey

I've been trying to start using WebAssembly with Rust for years. I've followed several tutorials, only a few of which got me started – and those ended up breaking a few updates later. Your second step explanations, in only a few lines, got me started. Thank you so much. You made my New Year's Eve. :-)

Collapse
 
valeriavg profile image
Valeria

While I fully support the suggestion to use Rust for parts that require heavy computation or memory management, developing UI in WASM would result in huge packages, clunky developer experience and zero benefits to performance because the heavyweight render process is already hyper optimised by the browsers and the scaffold to connect UI to wasm package would be much bigger than writing UI itself.

Collapse
 
kinsondigital profile image
KinsonDigital • Edited

I could take any language and compile it to wasm code and it would perform the same for the most part because they're both wasm code.

What I mean is that it's not actual rust that is running in the browser, it is the wasm that runs in the browser.

This is how I thought it worked but I could be wrong.

Collapse
 
dyfet profile image
David Sugar • Edited

Some languages may be very heavy in minimum runtime support they require. The advantage rust has is that rust wasm has is no explicit or large "runtime" library to carry along and bundle with it (compared to go, for example), so you can make very small wasm rust binaries to start with. But you will still need some wasm compiled rust ui framework to bundle into it to do anything useful. I did explore Qt wasm for awhile, but that requires a static wasm Qt build, which, while supported, along with C++ on wasm, using emscript to compile it, produces rather huge wasm files to deploy. Is yew a tight rust ui framework for web/wasm? If so, yes, rust could become a more realistic player. I am guessing yew is to rust what blazer tries to do for C#.

Collapse
 
mark_ellis_fc53cc851d3822 profile image
Mark Ellis

Yea if you wanted to run Python in wasm you’d have to compile the entire interpreter into to wasm.
And yea well, Python is garbage at the best of times.

Collapse
 
mark_ellis_fc53cc851d3822 profile image
Mark Ellis

I probably would bother using wasm to render html, but for computational intensive tasks running on the front end absolutely. I essentially just use Java script to render the front end and glue everything together, that’s what script languages are for, that’s what they’re good at, heavy computations not so much.
Backend usually because the environment is known I’d use FFI to call rust from whatever script not WASM s it will run faster and they’re less overhead, WASM does isolate native code and can be more secure though, so if I were calling c libraries that I didn’t write, either from Java script or rust then I’d use web assembly on the server.

Collapse
 
robertomaurizzi profile image
Roberto Maurizzi

You should definitely take a look at the Leptos project

Collapse
 
tharcissentirandekura profile image
Ntirandekura Tharcisse

If you have experience with React, you may try yew which is more similar to React and it is macro based component similar to React again but I was recently working on my project and I ended up shifting to struct based comonent because I found more support.

Give it a shot, u may like it.

Collapse
 
ddebajyati profile image
Debajyati Dey

Is there currently any great library/framework for building website frontend in rust?

Collapse
 
robertomaurizzi profile image
Roberto Maurizzi

Leptos looks very promising

Collapse
 
smartstak profile image
smartstak

Rocket framework is better for web development

Collapse
 
sanampakuwal profile image
Sanam

tldr. rust is not for webdev

Collapse
 
lurodriguez profile image
L Rodríguez

I will try this, not sure if even if a website can be done with Rust, is better than the current options ( javascript, node, php, etc )

Some comments may only be visible to logged-in visitors. Sign in to view all comments.

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay