Sorting Algorithms Visualizer

A dynamic, interactive web application for visualizing various sorting algorithms in real-time. Built with Next.js, TypeScript, and Framer Motion.

🚀 Features

• Multiple Sorting Algorithms

  • Bubble Sort
  • Quick Sort
  • Merge Sort
  • Heap Sort

• Interactive Visualization

  • Real-time array manipulation visualization
  • Color-coded elements showing different states:
    • 🟦 Default state
    • 🟨 Comparing elements
    • 🟥 Swapping elements
    • 🟩 Sorted elements

• Performance Metrics

  • Real-time statistics tracking
    • Number of comparisons
    • Number of swaps
    • Execution time
  • Comparative analysis between algorithms
  • Performance benchmarking

• User Controls

  • Adjustable animation speed
  • Pause/Resume functionality
  • Audio feedback with enable/disable option
  • Array regeneration
  • Algorithm selection

• Data Analysis

  • Historical data tracking
  • Performance graphs
  • Export functionality (CSV/JSON)
  • Comparative statistics

🛠️ Technologies Used

• Next.js 13+
• TypeScript
• Tailwind CSS
• Framer Motion
• Chart.js
• Canvas Confetti
• Web Audio API

📦 Installation

1. Clone the repository:

git clone https://github.com/leghis/sorting-visualizer.git