English for Dioxus Developers

Dioxus deliberately mirrors React’s vocabulary in Rust, which helps developers transfer knowledge quickly, but a few terms — renderer, hot reload, RSX — carry Dioxus-specific meaning worth learning precisely.

Key Vocabulary

Renderer — the backend that turns Dioxus’s virtual DOM into actual output, whether that’s a web page, a native desktop window, or a mobile screen, all from the same component code. “We’re not rewriting the UI for desktop — we’re just swapping the web renderer for the native renderer.”

RSX — Dioxus’s JSX-like macro syntax for writing UI markup directly inside Rust code, compiled at build time into function calls that construct the virtual DOM. “The RSX won’t compile because that closing tag is missing — Rust’s macro system is strict about matching structure here.”

Hook — a function like use_signal or use_effect that lets a component hold state or run side effects, following the same rules-of-hooks conventions familiar from React. “Don’t call that hook conditionally — Dioxus expects hooks to run in the same order on every render, just like React does.”

Component — a function that takes props and returns RSX, composed together to build the UI tree, with Dioxus re-rendering only the components affected by changed state. “Split this into a smaller component so the list item doesn’t have to accept the entire page’s state as props.”

Hot reload — Dioxus’s development feature that applies UI and logic changes to a running app instantly, without a full recompile or losing application state. “Just save the file — hot reload will pick up the RSX change without restarting the app or resetting your test data.”

Common Phrases

• “Which renderer are we targeting here — web, desktop, or mobile?”
• “Is this hook being called conditionally? That’ll break on the next render.”
• “Should this be its own component, or is it small enough to inline in the parent?”
• “Did hot reload actually pick up the change, or do we need a full rebuild?”
• “Is the RSX macro failing to compile, or is this a runtime panic?”

Example Sentences

Debugging a hook ordering issue: “The state got mixed up between renders because a hook was called inside an if block — pull it out so it runs unconditionally on every render.”

Explaining an architecture choice: “We wrote the core logic once and just swap renderers between the web build and the desktop build — that’s the whole point of using Dioxus here.”

Reviewing a pull request: “This component’s doing too much — split the list rendering into its own component so it doesn’t need the parent’s full state as props.”

Professional Tips

• Say renderer when explaining cross-platform behavior — it names the actual abstraction Dioxus uses to target web, desktop, and mobile from one codebase.
• Use RSX specifically for the markup macro, not “JSX” — they look similar but RSX is Rust-macro-based, not a separate compiler transform.
• Reference the rules of hooks by name when reviewing conditional hook calls — it’s a precise, well-known constraint rather than a vague style preference.
• Mention hot reload when describing your dev workflow — it signals you’re using Dioxus’s fast iteration loop instead of rebuilding on every change.

Practice Exercise

1. Explain what a renderer is in Dioxus and why the same component code can target web and desktop.
2. Describe why hooks can’t be called conditionally, using the term “rules of hooks.”
3. Write a sentence explaining what hot reload does during development.