AlgoViz is an interactive visualizer for two of the algorithm families every CS student eventually has to internalize: pathfinding and sorting. On the pathfinding side, you draw walls on a grid, drop a start and end point, generate a maze, and watch algorithms like A* or Dijkstra's actually explore the space in real time, cell by cell. On the sorting side, an array renders as a set of bars, and you watch them compare and swap live as different sorting algorithms work through the same data. Both sides have speed controls, so you can slow things down to actually follow the logic or speed them up to compare algorithms at a glance.
Pathfinding algorithms: BFS, DFS, Greedy Best-First Search, Bidirectional BFS, A* Search, Dijkstra's Algorithm, Iterative Deepening DFS, and Random Best-First Search.
Sorting algorithms: Bubble Sort, Selection Sort, Insertion Sort, Merge Sort, Quick Sort, Heap Sort, and Cocktail Sort.
Why I Built It
I wanted a concrete way to demonstrate that I actually understand these algorithms, not just that I can recite their time complexity. Anyone can describe how A* works in an interview. Building a tool that correctly animates eight different pathfinding strategies and seven different sorting algorithms, each with their own real implementation underneath, is a much harder thing to fake.
Key Features
- A drawable pathfinding grid. Click to place walls, set start and end nodes, or generate a random maze, then run any of eight algorithms against the exact same layout to compare how differently they explore it.
- Real-time sorting animation. An array renders as bars, and every comparison and swap made by the algorithm is reflected live, so the difference between, say, Bubble Sort's brute-force passes and Merge Sort's divide-and-conquer structure is visible instead of theoretical.
- Speed controls on both sides. Slow it down to trace exactly what a single step is doing, or speed it up to watch the overall shape of an algorithm's behavior.
- A clean, minimal interface that stays out of the way of the actual visualization, since the algorithms are the point, not the chrome around them.
The Hardest Part
Oddly, the hard part wasn't building a website. It was translating algorithms I'd only ever known as pseudocode and complexity analysis into something that actually renders, step by step, in a browser. Writing a correct A* implementation on paper is one thing. Writing one that pauses after every single node exploration so the UI can paint the current state, then resumes exactly where it left off, forces you to actually understand the algorithm's internal state at every step, not just its final output. That reframing, from "does this return the right answer" to "can I expose every intermediate step correctly", was where most of the real work went.
Outcomes
- A live, working visualizer covering 8 pathfinding algorithms and 7 sorting algorithms, all implemented and animated from scratch.
- A tool that needs zero ongoing maintenance to stay useful, it's been running unattended at its live URL since launch.
- A genuinely useful reference for anyone (myself included) who wants to see the actual difference between, say, Dijkstra's and A* on the same maze, instead of just reading about it.