0
# Graph Visualization
1
2
Commands for visualizing project and task dependencies through interactive web-based graphs that help understand workspace structure and execution flow.
3
4
## Capabilities
5
6
### Action Graph
7
8
Display an interactive dependency graph of all tasks and actions in the execution pipeline.
9
10
```bash { .api }
11
moon action-graph [targets...] [--dependents] [--host <HOST>] [--port <PORT>]
12
```
13
14
**Alias:** `moon ag`
15
16
**Arguments:**
17
- `targets` (optional) - Specific targets to focus the graph on
18
19
**Options:**
20
- `--dependents` - Include dependents of the focused targets in the graph
21
- `--host <HOST>` - Host address for the graph server (default: "127.0.0.1")
22
- `--port <PORT>` - Port to bind the graph server to (default: "0" for auto-selection)
23
24
**Usage Examples:**
25
26
```bash
27
# Show all actions in the workspace
28
moon action-graph
29
30
# Focus on specific targets
31
moon action-graph my-app:build my-app:test
32
33
# Include dependents of focused targets
34
moon action-graph my-app:build --dependents
35
36
# Use short alias
37
moon ag
38
39
# Custom host and port
40
moon action-graph --host 0.0.0.0 --port 3000
41
```
42
43
The action graph shows:
44
- Individual task nodes with status and timing
45
- Dependency relationships between tasks
46
- Execution order and parallel opportunities
47
- Cache hit/miss information
48
- Task failure points and error details
49
50
### Project Graph
51
52
Display an interactive graph showing relationships between projects in the workspace.
53
54
```bash { .api }
55
moon project-graph [id] [--dependents] [--host <HOST>] [--port <PORT>]
56
```
57
58
**Alias:** `moon pg`
59
60
**Arguments:**
61
- `id` (optional) - Project ID to focus the graph on
62
63
**Options:**
64
- `--dependents` - Include direct dependents of the focused project
65
- `--host <HOST>` - Host address for the graph server (default: "127.0.0.1")
66
- `--port <PORT>` - Port to bind the graph server to (default: "0" for auto-selection)
67
68
**Usage Examples:**
69
70
```bash
71
# Show all projects in workspace
72
moon project-graph
73
74
# Focus on a specific project
75
moon project-graph my-app
76
77
# Include project dependents
78
moon project-graph shared-utils --dependents
79
80
# Use short alias
81
moon pg
82
83
# Custom server configuration
84
moon project-graph --host localhost --port 8080
85
```
86
87
The project graph displays:
88
- Project nodes with metadata (language, type, platform)
89
- Dependency relationships between projects
90
- Workspace structure and organization
91
- Project health and status indicators
92
93
### Task Graph
94
95
Display an interactive graph of tasks and their dependencies within the workspace.
96
97
```bash { .api }
98
moon task-graph [target] [--dependents] [--host <HOST>] [--port <PORT>]
99
```
100
101
**Alias:** `moon tg`
102
103
**Arguments:**
104
- `target` (optional) - Specific task target to focus the graph on
105
106
**Options:**
107
- `--dependents` - Include direct dependents of the focused target
108
- `--host <HOST>` - Host address for the graph server (default: "127.0.0.1")
109
- `--port <PORT>` - Port to bind the graph server to (default: "0" for auto-selection)
110
111
**Usage Examples:**
112
113
```bash
114
# Show all tasks in workspace
115
moon task-graph
116
117
# Focus on a specific task
118
moon task-graph my-app:build
119
120
# Include task dependents
121
moon task-graph shared-utils:build --dependents
122
123
# Use short alias
124
moon tg
125
126
# Bind to all interfaces
127
moon task-graph --host 0.0.0.0
128
```
129
130
The task graph shows:
131
- Task nodes with configuration details
132
- Inter-task dependencies and execution flow
133
- Task types and platforms
134
- Estimated execution times and resource usage
135
136
## Graph Features
137
138
### Interactive Navigation
139
- **Zoom and Pan** - Navigate large graphs with mouse and keyboard
140
- **Node Filtering** - Filter nodes by type, status, or metadata
141
- **Search** - Find specific projects or tasks quickly
142
- **Layout Options** - Switch between different graph layouts
143
144
### Node Information
145
- **Hover Details** - View detailed information by hovering over nodes
146
- **Click Actions** - Click nodes to view full configuration
147
- **Status Indicators** - Visual indicators for success, failure, and cache status
148
- **Timing Information** - Execution times and performance metrics
149
150
### Export and Sharing
151
- **URL Sharing** - Share graph views via URL parameters
152
- **Screenshot Export** - Export graph visualizations as images
153
- **JSON Export** - Export graph data for external analysis
154
155
## Graph Server
156
157
Moon starts a local web server to serve the interactive graphs:
158
159
```bash
160
# Default behavior - auto-select port
161
moon project-graph
162
# Output: Graph server running at http://127.0.0.1:3001
163
164
# Specify custom port
165
moon action-graph --port 4000
166
# Output: Graph server running at http://127.0.0.1:4000
167
168
# Bind to all interfaces
169
moon task-graph --host 0.0.0.0 --port 3000
170
# Output: Graph server running at http://0.0.0.0:3000
171
```
172
173
The server automatically:
174
- Opens the graph in your default browser
175
- Provides real-time updates as the workspace changes
176
- Supports multiple concurrent viewers
177
- Shuts down when the command is terminated
178
179
## Environment Variables
180
181
Graph server behavior can be configured via environment variables:
182
183
- `MOON_HOST` - Default host address for graph servers
184
- `MOON_PORT` - Default port for graph servers
185
186
```bash
187
# Set default host and port
188
export MOON_HOST=0.0.0.0
189
export MOON_PORT=3000
190
moon project-graph
191
```
192
193
## Use Cases
194
195
### Development Workflow
196
- **Dependency Analysis** - Understand project relationships before making changes
197
- **Task Planning** - Visualize task execution order and optimization opportunities
198
- **Impact Assessment** - See which projects will be affected by changes
199
200
### CI/CD Optimization
201
- **Parallel Execution** - Identify tasks that can run in parallel
202
- **Bottleneck Detection** - Find tasks that block parallel execution
203
- **Resource Planning** - Optimize CI job distribution based on task dependencies
204
205
### Architecture Review
206
- **Dependency Validation** - Ensure project dependencies follow architectural guidelines
207
- **Circular Dependencies** - Identify and resolve circular dependency issues
208
- **Modularization** - Plan project splits and dependency refactoring
209
210
### Team Communication
211
- **Onboarding** - Help new team members understand codebase structure
212
- **Documentation** - Visual documentation of system architecture
213
- **Planning** - Collaborate on architectural changes using visual graphs