Awesome Open Source
Awesome Open Source

Sorting Visualizer

Responsive visualizer built using React for popular algorithms

cover See it in action

This repo is an attempt to help in learning popular sorting algorithms by visualization

Helps to

  • understand the working of sorting algorithm
  • check total swaps required
  • check total comparisions
  • compare algorithms side by side
  • know the time taken (time is just an approximate unit for comparision)


  • Sort any given array of 3 digits positive integers
  • Alter the speed of execution
  • Start, pause and reset the execution
  • Generate random array of numbers of sorting


Features built using

  • Animations are done using pure CSS and uses FLIP principle
  • Flex is used for array display and manipulation of positions (flex order property)
  • JavaScript async generators are used heavily for the controlled execution of algorithms

Run in your local

  • git clone
  • npm install (after navigating inside the directory)
  • npm run dev

Contributing Guide

If you want to contribute, improve or fix bugs in this repo, then check out the Contributing Guide


This repository is MIT licensed. Read more

Alternative Project Comparisons
Related Awesome Lists
Top Programming Languages
Top Projects

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Javascript (1,060,209
Reactjs (162,487
Algorithms (37,445
Data Structure (9,488
Styled Components (4,133
Sorting Algorithms (781
Zustand (104