DepViz

A canvas-style dependency visualizer for codebases. Import files/folders, see modules/classes/functions, and follow calls/imports. Drag things around. Export snapshots. All local, no telemetry.

Highlights

• Import from Explorer (context menu) or drag & drop.
• See modules, classes, functions, and edges (call/import/inherit).
• Jump to code (Go to Definition, Peek References).
• Arrange automatically by folders or grid.
• Filter edge types from the legend.
• Search labels (Ctrl/Cmd+F) with next/prev.
• Export PNG / SVG / JSON / snapshot (.dv).
• Impact slices: highlight inbound/outbound blast radius.

Requirements

• VS Code ^1.80.0
• Works with TypeScript/JavaScript/Python (heuristic parsing).

Commands

• DepViz: Open (depviz.open)
• DepViz: Import into Canvas (depviz.import)

Shortcuts:

• A: Arrange by folders
• B: Balanced grid
• Ctrl/Cmd+F: Search
• Right-click canvas/nodes: export, focus, impact slice, delete

Using the Custom Editor

DepViz registers a custom editor for *.dv (saved snapshots). Open a .dv file to restore a graph view. You can also save the current canvas to .dv from the context menu (Export ➜ Save Snapshot).

How to Use

1. Open DepViz (DepViz: Open) — empty canvas appears.
2. Import code:
   • Right-click folder/file in Explorer ➜ DepViz: Import into Canvas, or
   • Drag files/folders onto the canvas.
3. Explore:
   • Toggle edge types from the legend (top-right).
   • Right-click nodes for Go to Definition / Peek References.
   • Use impact slices to see inbound/outbound dependencies.
4. Export PNG/SVG/JSON or save a .dv snapshot.

What’s Parsed

• Functions & classes (labels like def foo() / class Bar / function baz()).
• Edges:
  • call (solid green) — inferred from function bodies.
  • import (dashed blue) — from import/require (TS/JS) and import/from (Python).
  • inherit (orange) — class inheritance (Python).

Note: For import edges to connect, import both files involved.

Performance & Limits

• Skips big files (> ~1.5 MB) and common junk folders (node_modules, .git, dist, etc.).
• Parser is heuristic; language servers improve symbol detection where available.
• No internet usage; everything runs locally in the webview.

Privacy

• No telemetry.
• Runs entirely on your machine.

Troubleshooting

• Nothing shows up? Make sure you imported files and the canvas is open.
• Edges missing? Import both source and target files; some calls are heuristic.
• Still stuck? Try arranging (press A) or re-importing a smaller folder slice.

Tip: Save a .dv snapshot, commit it, and share the view with your team.