Home▸Computer Science▸Cyclomatic Complexity Explorer (2D)

Cyclomatic Complexity Explorer (2D)

Build a control-flow graph by adding IF branches, LOOPs and SWITCH statements on a pannable, zoomable 2D canvas, and watch McCabe's Cyclomatic Complexity M = E - N + 2 update live — the exact metric linters like ESLint, SonarQube and Android Lint flag as a maintainability risk.

Computer Science2DModerate60 FPS📱 Mobile-adapted⇄ 3D version

Details

CategoryComputer Science

RenderingCanvas 2D

DifficultyModerate

Target FPS60

ControlsButtons add statements, IF/ELSE branches, LOOPs and 3-way SWITCH constructs to a live control-flow graph (with undo and a random-function generator), a threshold slider mirrors a linter's max-complexity rule, and drag-to-pan plus scroll-to-zoom (with a fit-to-view button) navigate the 2D graph.

code qualitystatic analysislintingcontrol flow graphsoftware metricsalgorithms

Related simulations

Hash Function Avalanche VisualizerInteractive 3D bit-grid where flipping a single input bit shows how a cryptographic hash's…

Merkle Tree Proof VisualizerInteractive 3D binary hash tree where selecting a leaf and generating its proof path shows…

CPU Scheduling Policy SimulatorInteractive 3D process queue where switching between FCFS, SJF, priority and round-robin… ⊞ All 327 in Computer Science →

Every static-analysis linter — ESLint, SonarQube, Android Lint, Detekt — flags functions once their control-flow graph gets too tangled, and the number they check is McCabe's Cyclomatic Complexity: M = E − N + 2, the count of edges minus nodes in the function's graph plus two. This simulator lets you build that graph construct by construct — straight-line statements, IF/ELSE branches, LOOPs with back-edges, and multi-way SWITCH statements — and renders it live as a pannable, zoomable 2D control-flow graph while every metric a linter would report (node count, edge count, decision points, minimum test paths, and M itself) updates in real time against a configurable lint threshold, exactly the rule a CI pipeline runs on every commit.

⚙ Under the hood

Build a control-flow graph out of IF/ELSE branches, LOOPs and SWITCH statements on a pannable, zoomable 2D canvas, and watch McCabe's Cyclomatic Complexity (M = E - N + 2) update live against a configurable linter threshold.

code qualitystatic analysislintingcontrol flow graphsoftware metricsalgorithms

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install