A web-based interactive visualization tool that demonstrates how six classic sorting algorithms work:
- Bubble Sort
- Selection Sort
- Insertion Sort
- Merge Sort
- Quick Sort
- Heap Sort
This app is designed to help you see and understand how different sorting algorithms operate:
-
Observe element comparisons and swaps with color-coded visual feedback:
- Blue: default state
- Yellow: currently being compared
- Red: identified as out of place
- Green: sorted/final position
-
Adjust algorithm execution using interactive controls:
- Speed: five levels of animation pace
- Data Size: number of elements in the array
- Generate New Array: randomizes data for fresh runs
-
See time & space complexity metrics dynamically displayed for each algorithm
Check out the live version online:
https://kethantummala.github.io/Sorting_Visualizer/
- Modern browser (Chrome/Firefox/Edge) with JavaScript enabled
- Optional: Live Server or any static server
-
Clone the repo:
git clone https://github.com/Kethantummala/Sorting_Visualizer.git cd Sorting_Visualizer -
Launch via Live Server or open
index.htmlin your browser. -
Use the app to visualize different sorting algorithms, experiment with speed/data size, and refresh with new datasets.
- JavaScript: main logic for algorithm steps and visualization
- HTML5 & SCSS/CSS3: layout and styles
- How sorting algorithms perform comparisons, swaps, and recursive operations
- Visual interpretation of time and space complexities
- JavaScript best practices in DOM manipulation and animation control
| Algorithm | Best Case | Average Case | Worst Case | Space Complexity |
|---|---|---|---|---|
| Bubble Sort | O(n) | O(n²) | O(n²) | O(1) |
| Selection Sort | O(n²) | O(n²) | O(n²) | O(1) |
| Insertion Sort | O(n) | O(n²) | O(n²) | O(1) |
| Merge Sort | O(n log n) | O(n log n) | O(n log n) | O(n) |
| Quick Sort | O(n log n) | O(n log n) | O(n²) | O(log n) avg |
| Heap Sort | O(n log n) | O(n log n) | O(n log n) | O(1) |
Want to add more features, improve UI, or include more sorting algorithms (e.g. Shell, Radix)?
- Fork the repository
- Create a new branch (
feature/your-feature) - Commit your improvements
- Open a pull request with a clear description
This project is free to use and modify under the MIT License.
- Inspiration from many sorting visualizers on GitHub
- Kudos to the open-source community for educational contributions that made this possible
Enjoy exploring sorting algorithms!