The Ultimate C++ Competitive Programming Execution Visualizer for VS Code
CP Visualizer is a focused VS Code extension designed specifically for C++ competitive programmers. It seamlessly integrates a compact local runner and an advanced execution visualizer directly into your workflow, eliminating the need to constantly switch between your IDE and external online visualization tools.
🚀 Features
Fast Native Run Visualization: Compiles and runs your C++ code natively to capture a high-speed execution trace, completely bypassing slow traditional debugger latency.
Interactive Visualizer Panel: Step backward and forward through your code execution in real-time. Observe local variables, loops, and condition evaluations with precise editor line highlighting.
Advanced Data Structure Rendering: Automatically detects and visually renders complex C++ STL containers including:
vector, set, map, deque
stack, queue, priority_queue
1D Arrays and 2D Matrices (vector<vector<T>>)
Trees, Graphs, and Segment Trees (auto-detected via heuristic variable names like adj, tree, etc.)
Compact Custom Input Runner: Write, paste, and execute your code against custom inputs inside a sleek side-panel.
Input Presets Management: Save, label, and manage multiple input test cases specific to each source file you work on.
Context-Aware UI: A beautiful, premium visualizer panel that auto-expands only when data structures are traced, preventing screen clutter.
💡 Uses
Debugging Complex Algorithms: Ever wondered how your BFS queue, DFS traversal, or dynamic programming state matrix evolves at each step? CP Visualizer paints a real-time picture of your data structures as they change.
Rapid Prototyping & Testing: Quickly swap between different custom inputs to test edge cases without polluting your workspace with temporary text files.
Learning & Teaching: An excellent tool for understanding exactly how standard library containers and graph algorithms operate under the hood during execution.
⭐ Advantages of Using This Extension
Zero Friction Workflow: No need to copy-paste code into online visualizers. Everything happens instantly, privately, and securely within your local VS Code environment.
Extreme Performance: Because it uses a Fast Native Run strategy (source instrumentation rather than a slow DAP debugger step-through), it collects execution snapshots magnitudes faster than traditional debuggers.
Scalable Views: Includes built-in virtualization to handle rendering thousands of array elements without lagging your editor.
No Terminal Clutter: Executions and visualizer runs happen quietly in the background without constantly popping open the VS Code integrated terminal or Output panels—unless there is a compilation error you need to see.
⚙️ How to Use
Open a .cpp file containing your competitive programming solution.
Click the CP Visualizer icon in the left Activity Bar (or run CP Visualizer: Run With Input from the Command Palette).
Enter or load your custom input in the sidebar panel.
Click Run to quickly see the standard output.
Click Visualize Code to launch the interactive visualizer and step through your algorithm!
🔧 Settings
Customize the visualizer to your workflow via VS Code Settings:
cpVisualizer.compilerPath: Specify your C++ compiler (default: g++).
cpVisualizer.compilerArgs: Add specific C++ flags like -std=c++20.
cpVisualizer.segmentTreeHints / cpVisualizer.graphHints: Tweak the variable names the visualizer looks for to automatically draw trees and graphs!
