Sorting Algorithms Visualizer

Overview

Sorting Algorithms Visualizer is an interactive web application that helps users understand and visualize various sorting algorithms through dynamic, step-by-step animations. This project provides an educational tool to explore the mechanics and performance characteristics of different sorting techniques.

Features

Supported Sorting Algorithms

Simple Sorting Algorithms

• Bubble Sort
• Selection Sort
• Insertion Sort

Efficient Sorting Algorithms

• Merge Sort
• Quick Sort
• Heap Sort

Advanced Comparison-Based Algorithms

• Tim Sort
• Intro Sort

Visualization Capabilities

• Real-time array element comparison
• Swap tracking
• Performance metric tracking (comparisons and swaps)
• Adjustable sorting speed
• Visual representation of algorithm progression

Technologies Used

• Next.js
• React
• TypeScript
• Tailwind CSS
• Lucide React Icons

Getting Started

Prerequisites

• Node.js (v18 or later)
• npm or yarn

Installation

1. Clone the repository

git clone https://github.com/LucaPalminteri/sorting-algorithms-visualizer.git

2. Navigate to the project directory

cd sorting-algorithms-visualizer

3. Install dependencies

npm install
# or
yarn install

4. Run the development server

npm run dev
# or
yarn dev

5. Open http://localhost:3000 in your browser

How to Use

1. Browse through different sorting algorithms from the homepage
2. Click on an algorithm to view its detailed page
3. Customize sorting parameters:
   • Array size
   • Sorting speed
   • Array generation method
4. Observe the step-by-step sorting process
5. Review algorithm-specific details and time complexity

Learning Resources

Each algorithm page provides:

• Algorithm description
• Time complexity analysis (best, average, and worst-case scenarios)
• Visual representation of sorting mechanics

Performance Metrics

The visualizer tracks:

• Number of comparisons
• Number of swaps
• Sorting progression
• Algorithm-specific optimizations

Contributing

Contributions are welcome! Please follow these steps:

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

License

Distributed under the MIT License. See LICENSE for more information.

Contact

Luca Palminteri - [lucapalminteri02@gmail.com]

Project Link: https://github.com/LucaPalminteri/sorting-algorithms-visualizer

Acknowledgements

• Next.js
• React
• Tailwind CSS
• Lucide Icons