Visualize the complexity of your code in real-time. This extension calculates the Cyclomatic Complexity of your functions and applies a colorful heatmap directly to your editor, helping you identify areas that might need refactoring.
Features
Real-time Heatmap: Colors update as you type, providing immediate feedback on code branches.
Multi-language Support:
JavaScript & TypeScript (including JSX/TSX)
Python
C & C++
Java
HTML (embedded scripts)
Intelligent Scoring: Uses standard Cyclomatic Complexity logic (counting if, for, while, catch, etc.).
Smart Fallback: Works even without specialized language extensions using a robust regex-based fallback parser.
Performance Optimized: Debounced updates ensure a smooth editing experience without UI lag.
Color Coding
The extension uses the following color scheme based on complexity:
Complexity Score
Color
Interpretation
1 - 3
🟩 Green
Simple, easy to maintain.
4 - 7
🟧 Orange
Moderate complexity, consider monitoring.
8+
🟥 Red
High complexity, high risk, consider refactoring!
Usage
Auto-activation: The extension activates automatically when you open a supported file.
Command Palette: Run Show Complexity Heatmap from the Command Palette (Ctrl+Shift+P / Cmd+Shift+P) to manually trigger the update.
Typing: As you add logic (like if statements or nested loops), the background color of the function will shift along the gradient.
Supported Languages
Javascript (.js, .jsx)
Typescript (.ts, .tsx)
Python (.py)
C (.c)
C++ (.cpp)
Java (.java)
HTML (.html - script tags)
Installation
You can install this extension from the VS Code Marketplace. Search for "Function Complexity Heatmap".
