RuntimeConcepts
Interactive Architecture
An interactive, explorable version of the runtime's three-thread architecture diagram.
An explorable version of the architecture diagram. Click any node to highlight its connections and see details.
How It Works
The diagram is built with React Flow and renders as a custom MDX component (<InteractiveDiagram>). Compared to the static Mermaid version on the Architecture page:
- Click a node to highlight its direct connections and dim the rest
- Hover for a tooltip describing the component's role
- Selected node details appear in a panel below the diagram
- Dark mode follows the site theme
Nodes and edges are plain JavaScript objects defined inline -- positions, labels, descriptions -- so the diagram is maintained alongside the text it illustrates.