Dioxus 0.5: Web, Desktop, Mobile Apps in Rust
dioxuslabs.com
dioxuslabs.com
With these 0.5 changes the Dioxus authors remove almost all the complexities that I ran into when working on Ebou. I haven't played around with it yet, but the removal of lifetimes and constant cloning will make it a much more pleasant experience. I'm looking forward to trying it out, congratulations to the team for such an awesome release!
There are about a dozen Rust frameworks [1] that are trying to do the "native, reactive UI" you can deploy on desktop, web/wasm, mobile, etc. I'm worried about betting on the wrong horse and being stuck maintaining abandonware or being faced with a painful and pointless migration.
In a similar evolutionary race, there were dozens of Rust HTTP server frameworks. Now Axum, Actix, and Rocket appear to have the lead. I'm worried I made the wrong choice as the community momentum appears to be shifting to Axum.
Is there any indication Dioxus will win? It looks to have a large community, venture backing [2] (a good sign!), and more momentum than some of the others. I'd like to use one of these frameworks now, but I worry it's too early to place a bet. Are there any good indicators that now is a good time to start using it?
Are Leptos and Yew the other top contenders? These are the two names I hear the most, apart from Dioxus. What would make them a better (or worse) choice?
My company is heavily invested in Rust, Actix, and Bevy. We're looking at pairing Bevy with Dioxus or a similar framework to deliver native desktop and mobile clients in the future. I just want to make the right choice.
Also, stupid question: is Dioxus named after the Pokemon [3]? The logo makes me think there's something to that, but there are no Pokemon references in the codebase.
[1] https://github.com/flosse/rust-web-framework-comparison
[2] https://www.ycombinator.com/companies/dioxus-labs
[3] https://m.bulbapedia.bulbagarden.net/wiki/Deoxys_(Pok%C3%A9m...
Yew has had about 10 commits in the past 6 months and the original creator has since moved on.
Leptos is a good solution for web-app type stuff, but IMO there's a big usability gap. I'll let the community be the judge there, but I wrote up some differences here: https://github.com/dioxusLabs/dioxus/?tab=readme-ov-file#dio... Leptos was fortunate enough to receive a lot of attention from youtubers on its launch.
The most important thing here: we raised venture money for Dioxus. We have many years of runway, are pretty lean, and exclusively focused on pouring resources into making the best GUI library for Rust (and potentially branching out to Python/JS). Getting into YC isn't easy, raising money isn't easy, and there's currently no other Rust projects with similar goals, talent, and financial backing. Biased of course.
Oh, and we're committed to the bevy integration. bevy_dioxus is already updated for 0.5 and we share corporate sponsors with the bevy folks.
Final point, legally, no we're not inspired by any pokemon with a similar sounding name. Even though that pokemon is awesome.
Important, but in a _bad_ way? What will the VC expect out of Dioxus? How will you make money?
As much is the idealist in me wants to do that with no venture backing, the realist in me knows we need Dioxus to be self sustaining and providing legitimate value for people to switch. Google spends 76 million dollars a year on catering alone - there's no way you can compete with Android and Flutter without huge resources.
Apple and Google capture the value for their platforms via fees and lock-in. Our goal is to capture value by providing really good utilities for building and deploying apps. You can't move heaven and earth without a really big lever, and venture gives us more leverage.
We've got a decent amount of enterprise adoption and I think there's money to be made by selling something like a self-hosted Vercel. TBD on licensing - I'd want it to be open source but we wouldn't want people reselling our deploy platform.
We raised a seed to prove that people want to build with dioxus. If that hypotheses is validated, then we invest in the deploy model. If not, we have OSS grants and corporate sponsors that will keep the project alive for years even if the VC money runs out.
I'm not super interested in making money at the hobbyist tier - those developers are our evangelists. Enterprise self hosting is likely harder but I think we can provide a lot of value to teams building apps in large companies.
It's probably another year of iteration until I feel like we're 100% stable, but my penchant for another rewrite is at an all time low.
What is Dioxus's competitive proposition vs those two? The performance and memory efficiency+safety of Rust is one, any others?
Flutter is written in Dart but renders to a canvas on the web making it a very, very poor choice for web apps. Especially backend/fullstack apps. Plus you can't use tailwind or whatever flavor of css library there is today. Flutter just nailed the "get up and running" part which we've got as well: `cargo binstall dioxus-cli`, `dx new`, `dx bundle` is literally less than 30 seconds. Hopefully `dx deploy` coming soon.
Electron is... it's electron. A whole chromium instance, an IPC bridge between your frontend and the system, NodeJS, etc. If you compile for size, our desktop apps are 3mb. You can easily deploy them on an embedded/low end device. We're hoping to eat some market share in the embedded-ish land (not true embedded, but like industrial or POS).
Dioxus also has mobile and desktop compatible server functions which basically no other projects have. Expo has been kinda exploring this space. One of our examples is deploying your own LLM on your own infrastructure with a dioxus mobile app UI and it fits in a single file and builds in under a minute.
> If you compile for size, our desktop apps are 3mb.
I'm aware of this from familiarity with Tauri, but hearing it again still amazes me. Very cool.
I have an app in mind I want to build, and really would like to have standalone versions on Android+iOS+Linux+Mac+Windows, plus a web app. But there's no way I can manage all that as a single developer. And the fact no development tool has really nailed this yet is telling how hard it is. Whoever really gets this right will save a ton of developer hours across the industry, and that's valuable. Good luck, hope you guys pull it off!
PS - one feature request: a local/offline-first mode that eases development of apps that work even with poor or no internet connection. Basically I want to build something like Obsidian that is multi-platform, and does all processing and data storage locally first, in an accessible format like SQLLite or flat files, then syncs with the cloud when available, all with as few developer resources as possible. A tool that enables that would be amazing.
Flutter has an HTML renderer (https://docs.flutter.dev/platform-integration/web/renderers), but it's lower-performance than CanvasKit.
Why would Dioxus be any different? If VC's cared about tearing down walled gardens of Google and Apple, why not explicitly donate the money instead? Why have strings attached at all?
so, what they use instead? Bugged, dead OSS dropped by creators?..
Ok, if you find corp which will give you funding for your project without any expectations, then it is a win. But I am not sure how often this happens.
Donations are great but they're not how the system works, unfortunately. Dioxus could never compete with the two most valuable companies on earth if it wasn't a self-sustaining business. VC just lets me scale the team from 2 people to 10(?) and have some cash to iterate. We were "profitable" even before taking venture money.
Now we're able to take on more moonshot-type projects like the blitz renderer, a deploy platform, UI fuzz tooling, and more. We're using our seed round exclusively to make dioxus as awesome as possible, so even if it doesn't work out at a venture level, there's still a really cool, polished, end-to-end app framework that you can build and ship with in Rust.
https://dracc.commonsconservancy.org/0035/
https://tauri.app/about/governance
Just for me personally, I don't see the financialization of open source software as an intrinsic good thing and I reflect my technology choices to support this when applicable.
Tauri is seeking monetization via CrabNebula, but I can see how the governance structure would secure more confidence in the OSS side.
OSS backend libraries are easily forked, and someone is usually willing to hack on a database library, but GUIs tend to be boring to work on, and designers don't tend to have to the same gumption to work for free that developers do.
there are several ways to monetize:
- consultancy
- "Pro" extensions on top of OSS core
Enterprise extensions means the cursed land of open core and refusing to have features in the open source version, or a heavy SaaS push combined with a possible license change along the road, and these are the primary reasons to avoid VC-backed "open source for now".
yes, there are risks in exchange of VC money. You can branch your "Libre" project any time, and continue building on top of infra developed using VC funds and which you get for free.
But what are other choices?
I checked out the crate and am still a bit confused. If i may, is it a goal of bevy_dioxus to allow standard bevy gamedev but with the UI portion handled by dioxus?
Silly question, but where can I see the updated bevy integration?
It looks like https://crates.io/crates/bevy_dioxus/ is still using dioxus 0.2 and bevy 0.7 - both of which are quite old. Does your official bevy integration have some other name?
Dioxus is certainly taking the head spot in front end. I still have more concern about the venture backing than I have confidence about it, but for better or for worse, it is certainly the best attempt at this so far. I enjoyed yew as a react-style framework, but its development is slow. Dioxus has made a lot of progress, and in my experience, it is currently the best experience that can be had.
It's hard to say if now is the correct time, but I'd be watching it closely if I were you. There's been major work to improve the framework with many of the interfaces changing. Now might be a good time because of the progress made here, but I wouldn't be surprised if there were more changes in store. Although I imagine that you're used to that from bevy anyway.
I'd certainly agree that it's no longer the de facto top leader, but as a batteries-included HTTP server, it works well (it's been chugging along powering my personal website for years now) and as far as I know still has quite a sizeable userbase.
I'll second that. I was working on a GUI frontend for sshfs in Dioxus about 9 months ago. My impression was that it's a really, really good GUI framework... until you run into a wall because the developers aren't finished with some feature yet.
Sharing state across different contexts can also be a pain sometimes, but that's true of every GUI framework I've ever used, regardless of language or underlying technologies. Dioxus 0.5 looks like a big leap forward in this regard.
My blog uses Dioxus to render a sizable portion of its HTML. In that use case, its limits aren't pushed, and it does a wonderful job.
However I'm a bit perplexed with the solution to remove lifetimes [0]. Isn't it a poor's-man GC? What was the performance impact?
[0]: https://crates.io/crates/generational-box
Side-note: `[generational-box](https://crates.io/crates/generational-box)` link is broken
Now if you spammed `GenerationalBox::new()` in a loop or something, yeah, your garbage will exist until the component drops. But most of the time folks will just push/pop from a Map or a Vec and regular memory semantics apply.
This is essentially just ARC: https://en.wikipedia.org/wiki/Automatic_Reference_Counting
I understand that it’s some kind of arena allocation, but I don’t understand how they support copying without copying, or how this is safe:
> Internally, generational-box creates an arena of generational RefCell's that are recycled when the owner is dropped. You can think of the cells as something like &'static RefCell<Box<dyn Any>> with a generational check to make recycling a cell easier to debug. Then GenerationalBox's are Copy because the &'static pointer is Copy
Like okay, you can create a pointer to static data, but what if it’s something that doesn’t have a static lifetime?
Copy is a specific thing in Rust, it means that if a type implements the Copy trait, it can be copied via a memcpy, that is, it’s like a “shallow” copy as opposed to a “deep” copy.
So they’re not “copying without copying”, they’re letting you treat a non-Copy type as a Copy type, in my understanding.
> what if it’s something that doesn’t have a static lifetime?
The read me says it requires static content so the answer is “you can’t do that.”
It uses a very similar approach to a generational arena but with boxes instead of a centralized arena (to avoid locking issues). If you try to access the Copy reference to the data after it has been dropped, it will fail with a nice error message
Congrats to the team. Excited to try out the signals in this release.
I feel like despite the name and all the good it did for JS and the web, React is not exactly how I would envision "reactive UI" code to look like in 2024 if we have the choice of designing a language (or DSL) from a blank state
Which is not to say SwiftUI is perfect, but whatever code I write with it feels much more neatly organized / compartmentalized than similar code using React
IMHO the only real advantage of using JSX for cross-platform GUIs is... to reuse existing libraries that were built for the web, which means something like RSX has very little "transferable value" other than letting the developer transfer their conceptual knowledge of JSX to RSX. I'd argue that's a worse tradeoff than having the developer learn some new paradigm that is (again IMHO) objectively superior to the React/JSX one
TL;DR "SwiftUI but cross-platform" is the project I wish existed but doesn't. I'm aware of @Tokamak/TokamakUI but that's still very much incomplete and activity seems to have waned
[2] https://kweb.io/
I've pondered the idea of doing something like Kweb in Rust but looks like you've already done it with Dioxus so thank you for saving me the time :)
https://github.com/dioxusLabs/dioxus/?tab=readme-ov-file#dio...
Tauri puts your frontend in the webview and you need to communicate with native Rust functions through an IPC boundary (like electron).
In Dioxus your Rust code lives on the native side, so you don't need IPC to do things like read from the file system, websockets, etc. Tauri also forces your frontend to compile to WASM, and a lot of interesting rust crates don't compile to wasm.
It's a little hard to express how much simpler it is to build when you don't have an IPC boundary. Dioxus' tooling is also dedicated to just Rust, so you can go from zero to bundled `.app` in less than a minute (12 seconds fresh build, 20 seconds fresh bundle).
That being said we're huge fans of Tauri and the flexibility it gives you (frontend in whatever web-compatible UI you want) and you can even use Dioxus in your Tauri apps!
Here's how I use tauri:
Almost everything is native rust in the "backend" process, which is where main is. I don't need any ffi calls to write files, open ports, etc, it's a normal rust program that happens to have a web view.
So I've never had a problem with compiling to wasm, the GUI is TypeScript and the business logic is aot rust
The ipc boundary is annoying. It'll be faster in tauri 2, but in 1 it uses json or something internally, so you couldn't e.g. write a video player that uses a custom rust codec. Getting uncompressed video frames through ipc would kill perf
I'll take a look how dioxus solves this
I’ve been using Tauri (1.x) for a couple years shipping a video editor and I don’t think this is true? I went searching to verify and I couldn’t find anything saying it complies to WASM (or at least not that it requires compiling to WASM). Can you point me to where you saw this?
How'd you get that working?
The IPC layer has been a bit annoying and I'm looking forward to Tauri 2 where that'll get faster. I've worked around it for some stuff in the meantime by using a custom protocol and serializing stuff to binary.
Here's a guide for using Yew with Tauri. Notice how you need to install wasm-bindgen and wasm-pack. https://dev.to/stevepryde/create-a-desktop-app-in-rust-using...
I appreciated Dioxus directly addressing that in the README, but would also be interested to hear experiences from people with experience using both of them.
With Tauri, I built a toy desktop app to see whether the IPC was fast enough that the web frontend could update and do stuff on every keystroke without lagging (yes), and whether it could send a big file roundtrip from the frontend to the Rust layer and back to the frontend on every keystroke (no, not in my naive toy implementation anyway).
It seems like there's be many use cases where either Tauri or Dioxus would be fine, and some use cases where Dioxus would be better. Would love to hear comparative experiences, or even "we chose Dioxus|Tauri for our project because of X and Y" type stories.
Dioxus looks really cool, and I'm excited to try it.
We're hoping to move folks to the WGPU renderer in the long term, but it's still pretty raw and many companies using Dioxus are pragmatic enough to know that a webview is a good enough solution for like 90% of apps.
I wish you good luck!
I have started, stopped, rewrote, given up, and restarted development of a visual novel engine over and over again. My vision is something kind of like Ren'Py[1] but with cross-device game saves, cleaner packaging, improved DRM, better support for complex nonlinear plot development, and better tools for developing game mechanics that go beyond clicking through paragraphs of text.
A mobile/desktop/web-friendly GUI library that handles both conventional UI elements and 2D graphics elegantly would be a total game-changer for that project, which I'm hoping to get back to eventually.
I won't go into deep detail on my last stab at this project, but it involved making my own Ruby DSL compiler, making my own Ruby-to-Nim FFI library, and SDL2. It was pretty cool, and much faster than you'd expect, but also not very portable, and also nowhere close to complete.
[1]: https://renpy.org/
I'd love to see what these usages are, and what motivates this. I understand that sometimes people reach for unsafe too eagerly. But the std is full of unsafe and drawing the line there sometimes seems like a line in the sand.
We use it in 3 places:
- fixing some FFI on iOS
- enabling function-call syntax for signals (took this implementation from dtolnay)
- implementing Send/Sync for an ID that uses a pointer as a hash (which honestly could be removed in lieu of a usize, now that I'm looking at it)
crate authors that try to remove all unsafe often do it to relieve the burden of trust from the user.
_this_, in my opinion, is the power of the `unsafe` keyword (which probably should have been split into `trust_me` blocks and `check_yourself` functions). it constrains the conversations about memory safety into very tightly defined and auditable locations in the code, AND it creates new, manageable conversations about trust.
let mut count = use_signal(|| 0);
const [count, setCount] = createSignal(0)
Is there a reason Dioxus for the "use_signal" naming other than trying to be close to React?
Optimizations include: - splitting out dynamic pieces of the UI into their own "diff bin" - memoizations by default - signals implicitly marking attributes as dirty / managed
So, still react-like
We had been thinking about this rewrite for like 6 months, but put it off for a while. Glad we dove into it since the finished product is so much better.
If you have to rewrite your code once a year, maybe it helps to plan ahead before coding.
But, if you can rewrite your code once a year, you might not have too much code to worry about.
The Copy-state stuff also seemed impossible a year ago, so no way to plan ahead. Now, I think things have matured enough that there's hopefully not a major major rewrite for a long time.
I think we had a prototype of it a long time ago but couldn't figure out how to implement drop. Leptos came out but just leaked the runtime in its initial rev. We figured we could safely recycle the runtimes and voila, problem solved.
How is the support for SVG which I can interact with? I’m thinking of something like drawing a sudoku as an SVG, then letting people click on each cell.
Flutter/Dart promises this, but I really, really hate Dart.
It's good for other things like performance and safe concurrency, but a language that has GC seems easier for web development.
I'm using TypeScript nowadays (via Deno), and it seems quite flexible. (Deno is built using Rust, but that's not visible to the programmer.)
I would try Flutter again if I wanted to write a mobile app. I'm not wild about stateful / stateless widgets, though. Signals seem nicer.
And maybe this Rust framework will work out?
It felt like a language that was built for the singular purpose of supporting Flutter (which I actually did enjoy learning) instead of something that needed to exist in its own right. I wish they'd just picked something already baked.
Everything should work like normal except: attributes are not typed, custom event listeners must be implemented with web-sys
Also, thank you for linking to a particular commit. I wish GitHub would do that by default. The web is littered with GitHub links that either no longer work or highlight incorrect lines.
I'm guessing there is no way that's getting smaller?
I have some projects in the 1kb to 100kb territory I wouldn't mind rewriting, but not to that size.
You can get hello world to sub 50kb. Our todomvc in the docs gets to 234kb.
Also note that wasm starts really really quickly, so it's not 1:1 JS<->WASM.
IMO if you're building an app in Rust, you probably want to avoid the wasm build step and shim out to the little bit of JS here-and-there for interactions you can't quite get in Dioxus.
You're probably not going to be building an email client or the next instagram in egui, but it is good for stuff where you're fine with re-rendering every entire frame (data viz, graphics stuff).