See your code flow and file connections on an infinite canvas.
Explore file relationships, understand application flow, and gain insights into your project structure in a more intuitive way.
Supporting for now, although some of the features might work for other languages
Features:
1. Opening files in the canvas
ℹ️ Show details
** Opening the canvas: **
Type Open Code Canvas in the Command Palette (Cmd + shift + P)
Click Code Canvas icon in the bottom right corner
** Navigating: **
Cmd + scroll to zoom
Hold Space to enable panning, then drag from an empty space on the canvas
Use the minimap controls or drag on the minimap to move (Press M to toggle minimap)
** Opening / closing files: **
Right Click a file or folder in the side bar and select Open in Code Canvas
Select files and hit Backspace or Cmd + X to close them. Shift + X to close all files
Drag out the import handle to open imported files
Node Toolbar
Open all imported files by clicking the right arrow in the file node toolbar
Or open all files that import that file by clicking the left arrow
Option + click on an arrow to see the list of files and select which ones to open
2. Real-time display of local changes
Particularly useful for understanding changes done by AI assistants, or reviewing large amounts of edits across multiple files before committing
Press Shift + O to open all the files in the current workspace that have any changes (added, removed, edited)
Editing a file automatically opens it in the canvas
Changes are automatically refreshed when you commit, stage, or unstage files
3. Visual display of token references and their connections
Click on a token (functions, variables, params, etc) to open a dropdown with a list of references, definitions, implementations, as well as outgoing and incoming calls for functions
(Press R to toggle the display of the references dropdown when tokens are selected)
Trace code execution paths visually: see relationships between functions and their references throughout all the files in the codebase
4. Layout algorithms for organizing your selected files
Layout options with keyboard shortcuts (Shift + 1, 2, 3, 4, etc) to organize your view
Select files to apply the algorithm only to the selection
Shit + 1 is a custom layout algorithm with adjustable parameters. Open the Layout Panel in the toolbar to customize it
Auto-fit and spacing options apply only to algos from 2 onwards
🔒 Privacy & Security
Your code stays on your machine
All code processing is done locally on your device
No code is ever sent to external servers
Code analysis, syntax highlighting, and file relationships are computed entirely within VS Code
Git authentication is only used for subscription management - your repository content remains private
Analytics & Privacy
We collect anonymous usage analytics to improve the extension
No source code or file content is ever included in analytics data
Analytics data consists only of feature usage patterns and performance metrics
All personal and code-related information remains strictly on your device
For detailed information about data collection and usage, please see our Privacy Policy.