Sorting Algorithm Visualizer
Watch Bubble Sort, Selection Sort, Insertion Sort, Merge Sort, and Quick Sort animate step by step on a bar chart. Comparisons, swaps, and sorted elements are colour-coded so you can follow every operation. No signup, runs entirely in your browser.
How to Use the Sorting Algorithm Visualizer
- 1Choose an algorithm — Bubble, Selection, Insertion, Merge, or Quick Sort.
- 2Set the array size and speed; slow it down when learning a new algorithm.
- 3Watch the colour-coded bars — blue compared, orange swapped, red pivot, green sorted.
- 4Run different algorithms on the same size and compare step counts.
Worked Example: Watching O(n²) and O(n log n) Diverge
Set the array size to 50 and run Bubble Sort. It compares adjacent pairs and bubbles the largest value to the end each pass, so it needs on the order of 50² / 2 ≈ 1,250 comparisons — you will watch a lot of small orange swaps crawl across the chart. Now run Merge Sort on the same size: it recursively halves the array (log₂ 50 ≈ 6 levels) and merges, taking roughly 50 × 6 = 300 operations. The visual difference in how long the animation runs is the O(n²)-versus-O(n log n) gap made concrete.
The visualizer also exposes the caveats that raw Big O hides. Run Quick Sort a few times: on random arrays it is fast, but its speed swings with pivot luck, and an already-sorted input with a naive pivot degrades toward O(n²). Meanwhile Insertion Sort, technically O(n²), finishes almost instantly on a nearly-sorted array of 8 elements — which is why real libraries switch to it for small runs. Seeing the bars move turns these “it depends” footnotes into something you can watch happen.
Algorithm Comparison Tips
Compare step counts
Set the same array size and run each algorithm. Merge Sort and Quick Sort take far fewer steps than Bubble Sort on large arrays — this makes O(n log n) vs O(n²) tangible.
Slow down for clarity
Set speed to Slow when studying a new algorithm. Watch exactly which elements are compared and swapped at each step before speeding up for the full picture.
Insertion Sort on small arrays
Insertion Sort performs very well on nearly-sorted arrays and small arrays (n < 20). Try it on size 8 — it often beats Merge Sort in raw step count on short inputs.
Stability comparison
Merge Sort and Insertion Sort are stable (equal elements maintain relative order). Quick Sort is typically unstable. Selection Sort is also unstable. Stability matters when sorting objects with multiple keys.
Frequently Asked Questions
Which algorithms are included?
Bubble Sort, Selection Sort, Insertion Sort, Merge Sort, and Quick Sort. These are the five algorithms most commonly covered in introductory computer science courses.
What do the bar colours mean?
Blue bars are being compared in the current step. Orange bars are being swapped. Red indicates the pivot element in Quick Sort. Green bars have been confirmed in their final sorted position.
What is the time complexity of each algorithm?
Bubble, Selection, and Insertion Sort are O(n²) in the worst case. Merge Sort is O(n log n) always. Quick Sort averages O(n log n) but degrades to O(n²) on already-sorted input with a naive pivot choice.
Why does Quick Sort sometimes look slow?
Quick Sort's step count depends on the pivot choices. The worst case occurs when the pivot is always the largest or smallest element. For random arrays (as generated here), Quick Sort is typically fast in practice.
What is the difference between Merge Sort and Quick Sort?
Merge Sort divides the array in half recursively, sorts each half, then merges them — always O(n log n). Quick Sort partitions around a pivot element, which is more cache-friendly but has a worst-case O(n²). In practice, Quick Sort is faster on most real-world data.
Is my data stored?
No. The arrays are generated in your browser and never sent to any server.