GUI Visualizer
Relevant source files
The following files were used as context for generating this wiki page:
The GUI Visualizer in Arbor is a local-first impact analysis interface designed to help developers visualize code dependencies and predict the "blast radius" of changes. The project includes two distinct graphical implementations: a high-performance interactive logic forest built with Flutter and a focused impact-first analysis interface built with Rust using the egui framework. Sources: README.md:32-47, crates/arbor-gui/src/main.rs:1-5
These interfaces enable users to interactively search for symbols, visualize direct and transitive dependencies, and export analysis results for documentation or pull requests. By parsing the codebase into a semantic dependency graph, the visualizer provides structural certainty regarding execution paths, including callers, callees, imports, and inheritance. Sources: README.md:40-47, crates/arbor-gui/src/app.rs:88-120
Architecture and Components
The Arbor visualization stack consists of a backend graph engine (arbor-graph) that serves data to graphical clients via JSON-RPC and WebSocket protocols. Sources: crates/arbor-cli/src/commands.rs:200-240
Multi-Client Architecture
Arbor supports multiple visualization frontends depending on the environment and use case:
- Flutter Visualizer: A specialized project located in the
visualizer/directory, optimized for large-scale graph rendering using Barnes-Hut QuadTree force simulations and velocity-based Level of Detail (LOD) rendering. Sources: PR_DESCRIPTION.md:28-32, CHANGELOG.md:55-60 - Rust GUI (
arbor-gui): A native desktop application built witheframeandeguithat focuses on immediate impact analysis for specific symbols. Sources: crates/arbor-gui/Cargo.toml:1-15
Core Data Flow
The following diagram illustrates how the CLI launches and coordinates the visualization stack:
The viz and bridge commands orchestrate the startup of the RPC server for queries and the Sync server for real-time updates and "Spotlight" tracking. Sources: crates/arbor-cli/src/commands.rs:184-230, crates/arbor-cli/src/commands.rs:360-400
Rust GUI Implementation (arbor-gui)
The arbor-gui crate provides a focused interface for symbol-based impact analysis. It uses a lazy-loading strategy to index the codebase only when an analysis is requested. Sources: crates/arbor-gui/src/app.rs:88-100
Application State
The ArborApp struct manages the UI state, search history, and analysis results:
| Field | Type | Description |
|---|---|---|
cwd | PathBuf | Current working directory being analyzed. |
symbol_input | String | The function, class, or method name entered by the user. |
graph | Option<ArborGraph> | The semantic dependency graph (lazy-loaded). |
result | Option<AnalysisResult> | The calculated impact data for the current symbol. |
show_file_path | bool | Toggle for "spoiler mode" to hide paths in screenshots. |
Sources: crates/arbor-gui/src/app.rs:33-65
Analysis Logic
When a user triggers an analysis, the GUI performs a multi-step traversal of the graph:
- Node Resolution: Matches the input string against node IDs or qualified names.
- Impact Traversal: Executes a bidirectional search (upstream callers and downstream dependencies) up to a depth of 5 hops.
- Role Classification: Categorizes the node as Isolated, Entry Point, Utility, or Core Logic based on its connectivity.
- Severity Mapping: Separates results into "Direct" (will break immediately) and "Indirect" (transitive impact).
Sources: crates/arbor-gui/src/app.rs:88-146
Flutter Visualizer
The Flutter-based visualizer is the primary tool for large-scale interactive graph exploration. It is launched by the CLI as either a bundled executable or via flutter run in development mode. Sources: crates/arbor-cli/src/commands.rs:242-280
High-Performance Rendering
To support codebases with over 100,000 nodes, the Flutter visualizer implements several optimization techniques:
- Barnes-Hut QuadTree: Reduces force-directed layout complexity to $O(n \log n)$. Sources: CHANGELOG.md:58
- Viewport Culling: Only renders nodes and edges currently within the visible area. Sources: CHANGELOG.md:59
- Velocity-Based LOD: Simplifies node rendering during rapid panning/zooming to maintain 60 FPS. Sources: PR_DESCRIPTION.md:29-30
Spotlight Mode
The visualizer supports a "Spotlight" feature, allowing external tools (like AI agents via MCP) to focus the camera on specific code entities. Sources: crates/arbor-cli/src/commands.rs:350-355, crates/arbor-mcp/src/lib.rs:56-70
GUI Features and Interactions
Impact Analysis Summary
The visualizer provides a detailed breakdown of how a symbol change ripples through the codebase.
| Feature | Description | Source |
|---|---|---|
| Role Inference | Categorizes nodes (e.g., Core Logic, Utility) based on graph topology. | app.rs:114-120 |
| Confidence Scoring | Explains the reliability of the analysis (High/Medium/Low). | README.md:124-130 |
| Search History | Persists recent queries for quick re-analysis. | app.rs:148-155 |
| Spoiler Mode | Obfuscates file paths for privacy-safe screenshots. | app.rs:232-260 |
| Markdown Export | Formats impact reports for easy insertion into PR descriptions. | app.rs:167-190 |
GUI Entry Point
The Rust GUI is initialized with standard desktop options and custom icon rendering from SVG assets.
// crates/arbor-gui/src/main.rs:12-28
let options = eframe::NativeOptions {
viewport: egui::ViewportBuilder::default()
.with_inner_size([800.0, 600.0])
.with_title("Arbor - Impact Analysis")
.with_icon(icon),
..Default::default()
};
eframe::run_native(
"Arbor",
options,
Box::new(|cc| {
egui_extras::install_image_loaders(&cc.egui_ctx);
Ok(Box::new(app::ArborApp::new(cc)))
}),
)
Summary
The GUI Visualizer serves as the interactive layer of the Arbor ecosystem, bridging static code analysis with developer workflows. By offering both a high-performance interactive graph (Flutter) and a focused impact analysis tool (Rust GUI), Arbor allows developers to explore complex dependencies and predict refactoring consequences with structural certainty. Its integration with the Model Context Protocol (MCP) further extends these capabilities to AI-assisted development environments.