DevTools Logo

Algorithm Arena & Data Structure Visualizer

About this tool

The Algorithm Arena turns complexity theory into something you can watch. Eight sorting algorithms — QuickSort in both Lomuto and Hoare flavors, MergeSort, HeapSort, RadixSort, InsertionSort, BubbleSort and a deliberately bounded BogoSort — run on one seeded input while every comparison, swap and write is recorded, so you can play, pause, scrub and single-step the exact execution. Race mode puts two or four algorithms side by side on identical data: the lanes finish with different op counts, and the trophy goes to the fewest operations.

The pathfinding lab pairs six classics — BFS, DFS, Dijkstra, A* with Manhattan or Euclidean heuristics, and Greedy Best-First — with three seeded perfect-maze generators (Recursive Backtracker, randomized Kruskal, randomized Prim). Watch the frontier ripple out, see exactly where DFS wastes effort compared to A*, and read the final path cost and visited-cell count for each run.

The data-structure panel records full snapshots at every operation, so BST inserts, AVL rebalancing rotations, Red-Black recolorings, B-Tree node splits, heap sift-downs and trie prefixes can be replayed forward and backward with the active node highlighted and each step explained in plain language.

Every algorithm ships with a line-highlighted reference implementation in JavaScript, Python, Go and C++ — the line currently executing lights up as the engine steps — plus a Big-O table you can export as Markdown, and the whole catalog as JSON. Sound can be enabled so compared values play as pitch (sonification) through the same audio engine that powers the synth tools.

All traces are computed locally in a Web Worker (with an inline fallback): nothing is uploaded, and a 64-element race replays smoothly because the heavy recording happened off the main thread.

How to use

  1. Pick your arena

    Choose the Sorting Arena, Pathfinding or Data Structures tab — each is a self-contained lab with its own controls.

  2. Race algorithms

    In sorting, toggle Single / Race 2 / Race 4, pick any combination of algorithms, set the size and seed, and press play. The lane with the fewest ops wins.

  3. Walk a maze

    In pathfinding, choose the algorithm and maze generator, regenerate for a new layout, then step or scrub through frontier, visits and the final path.

  4. Replay tree operations

    Enter keys (or words for a trie), press Run operations, and step through inserts, rotations and recolorings with the tree redrawn at every step.

  5. Read code and complexity

    The highlighted source panel follows execution line by line in JavaScript, Python, Go or C++, and the complexity table summarizes best/average/worst/space for every algorithm.

Use cases

Interview prep with receipts

Explain a rotation or a partition scheme while stepping the engine — the op log and highlighted code line back up every claim.

Choosing between algorithms with data, not vibes

Race your real shortlist on the size class you ship (8 vs 64 elements flips the InsertionSort vs MergeSort answer) and read the op counts.

Teaching CS fundamentals

Sonification plus lane races make the O(n log n) vs O(n²) gap something students feel rather than memorize.

Generating teaching material

Export the complexity table as Markdown for course notes, or the four-language catalog JSON for exercises and graders.

Common mistakes

Mistake:Reading op count as wall-clock time

Fix:Ops are engine steps, not seconds — compare algorithms within a language and a size class, not across them; real runtimes depend on memory layout and constants.

Mistake:Treating race winners as universal

Fix:The champion depends on input: re-run with a new seed and different sizes before concluding anything — QuickSort and InsertionSort swap places at small n.

Mistake:Expecting DFS to find the shortest path

Fix:Only BFS, Dijkstra and A* (with an admissible heuristic) guarantee optimality on these grids; DFS finds a path, not the path.

Mistake:Confusing the Euclidean A* variant as 'better'

Fix:Straight-line distance underestimates grid distance, so it stays optimal but usually expands more cells — compare the visited counts.

Frequently asked questions

References & standards