A sophisticated, production-ready web application for exploring and applying various compression algorithms. Built with React, TypeScript, and Tailwind CSS, this educational tool provides interactive demonstrations, detailed algorithm analysis, and practical compression capabilities.

https://compress-decompress-me-app.vercel.app/

https://www.youtube.com/watch?v=dwV-HAYMqwU

• Multi-Algorithm Support: RLE, Huffman, LZ77, DEFLATE, and LZ4 compression algorithms
• Dual Mode Operation: Compress files or decompress previously compressed files
• Real-time Processing: Interactive compression with progress tracking
• File Analysis: Detailed entropy analysis, byte frequency distribution, and compression potential assessment
• Performance Metrics: Speed, efficiency, and compression ratio comparisons
• Educational Content: Interactive algorithm demonstrations and comprehensive explanations

• Dark/Light Theme: Automatic system preference detection with manual toggle
• Responsive Design: Optimized for desktop, tablet, and mobile devices
• Drag & Drop: Intuitive file upload with visual feedback
• Progress Tracking: Real-time compression progress with algorithm-specific optimizations
• Visual Analytics: Charts and graphs for performance comparison and file analysis

• Entropy Calculation: Information theory analysis for compression potential
• Byte Distribution: Complete histogram of file content
• Pattern Recognition: Identification of repeated sequences and structures
• Algorithm Recommendations: Smart suggestions based on file type and characteristics
• Performance Comparison: Side-by-side algorithm efficiency analysis

• Node.js 18+
• npm or yarn package manager

1. Clone the repository

   git clone https://github.com/aryan3939/CompressDecompressMeApp
   cd CompressDecompressMeApp

2. Install dependencies

   npm install

3. Start development server

   npm run dev

4. Open in browser Navigate to http://localhost:5173

npm run build
npm run preview

Complexity: Low | Speed: Fast | Compression: Low

How It Works: Run-Length Encoding (RLE) identifies consecutive identical bytes and replaces them with a count and the byte value. Effective for data with long runs of identical values.

Example: WWWWWWWWWWBBBBBRRRRRRRRRRR → 10W5B10R

Best Use Cases:

• Images with solid colors
• Fax transmissions
• Binary data with repetition
• Video compression (static backgrounds)
• Medical imaging

Complexity: Medium | Speed: Medium | Compression: Medium

How It Works: Huffman Coding assigns shorter binary codes to more frequent symbols, using a binary tree. Optimal for data with skewed frequency distributions.

Example: 'ABRACADABRA' → 010110100010101011

Best Use Cases:

• Text files
• JPEG compression
• MP3 audio
• Network protocols
• Database systems

Complexity: High | Speed: Medium | Compression: High

How It Works: LZ77 uses a sliding window to find and encode repeated sequences as references to previous data.

Example: 'ABCABCABCABC' → (0,0,A)(0,0,B)(0,0,C)(3,3,A)...

Best Use Cases:

• ZIP files
• gzip compression
• PNG images
• Backup software
• Version control

Complexity: High | Speed: Medium | Compression: High

How It Works: DEFLATE combines LZ77 pattern matching with Huffman coding for optimal compression.

Example: Text with repeated headers and common letters is compressed in two stages: LZ77 then Huffman.

Best Use Cases:

• ZIP archives
• Web compression (gzip)
• PNG images
• PDF files
• Office documents

Complexity: Medium | Speed: Fast | Compression: Low

How It Works: LZ4 is a high-speed algorithm that quickly finds 'good enough' matches, prioritizing speed over ratio.

Example: 10MB file: 70% compression in 2s (traditional) vs 50% in 0.1s (LZ4)

Best Use Cases:

• Real-time systems
• Database storage
• High-performance computing
• Network appliances
• Container technologies

• Step-by-step demonstrations
• Customizable input
• Visual feedback
• Progress tracking

• Entropy calculation
• Frequency analysis
• Compression trade-offs
• Pattern recognition

• Compression ratio comparison
• Speed benchmarking
• Memory usage
• Efficiency scoring

• React 18.3.1
• TypeScript 5.5.3
• Tailwind CSS 3.4.1
• Vite 5.4.2
• Lucide React

• Recharts 2.8.0
• ESLint
• PostCSS

• Optimized performance
• Memory management (up to 100MB)
• Error handling
• Progress tracking
• Web Worker compatibility

• Multiple format support
• Drag & drop interface
• File type detection
• Size validation (100MB limit)
• Compression detection

src/
├── algorithms/           # Compression algorithm implementations
│   ├── deflate.ts       # DEFLATE (LZ77 + Huffman)
│   ├── huffman.ts       # Huffman coding
│   ├── lz77.ts          # LZ77 sliding window
│   ├── lz4.ts           # LZ4 high-speed compression
│   ├── rle.ts           # Run-length encoding
│   └── index.ts         # Algorithm orchestration
├── components/          # React components
│   ├── visualizations/  # Chart and analysis components
│   ├── AlgorithmSelector.tsx
│   ├── CompressionResults.tsx
│   ├── EducationalPanel.tsx
│   ├── FileUpload.tsx
│   └── ProgressIndicator.tsx
├── context/             # React context providers
│   └── ThemeContext.tsx # Dark/light theme management
├── data/                # Static data and configurations
│   └── algorithms.ts    # Algorithm metadata and explanations
├── types/               # TypeScript type definitions
│   └── index.ts
├── utils/               # Utility functions
│   └── fileUtils.ts     # File processing and validation
└── App.tsx              # Main application component

MIT License