Skip to content

browser-based image compression tool that respects your privacy

License

Notifications You must be signed in to change notification settings

abdullah-w-21/Squish

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

35 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Squish 🎯

A lightning-fast, browser-based image compression tool that respects your privacy. Compress and convert images instantly without uploading them to any server.

Deployed on Vercel License: MIT

✨ Features

  • 🚀 Client-side compression - your images never leave your device
  • 💫 Convert between JPEG, PNG, and WebP formats
  • 🎮 Interactive quality control with live preview
  • 📱 Fully responsive design
  • 🎯 Simple drag & drop interface
  • 📊 Before/after size comparison
  • ⚡ Zero dependencies (pure JavaScript)
  • 🔒 Privacy-focused

🔥 Live Demo

Try Squish Now

🛠️ Technology Stack

  • HTML5 Canvas API for image processing
  • CSS3 with modern features
  • Vanilla JavaScript (ES6+)
  • Built-in Browser APIs
  • No external dependencies

🚀 Methodology

Image Compression Process

  1. Client-Side Loading

    • Images are loaded directly in the browser
    • FileReader API converts images to data URLs
  2. Canvas Processing

    • Images are drawn onto HTML5 Canvas
    • Maintains aspect ratio while processing
  3. Quality Control

    • Dynamic quality adjustment (1-100%)
    • Real-time file size estimation
  4. Format Conversion

    • Uses Canvas.toBlob() API
    • Supports JPEG, PNG, and WebP
    • Automatic format optimization

Performance Optimization

  • Lazy loading of resources
  • Progressive image loading
  • Efficient memory management
  • Browser-native APIs

🏗️ Project Structure

squish/
├── index.html          # Main application file
├── README.md           # Documentation
├── LICENSE            # MIT License
└── vercel.json        # Vercel configuration

🤝 Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

  1. Fork the Project
  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

Areas for Contribution

  • 🎨 UI/UX improvements
  • 🚀 Performance optimizations
  • 📱 Mobile responsiveness
  • 🌐 Internationalization
  • 📝 Documentation improvements
  • 🐛 Bug fixes
  • ✨ New features

📝 License

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

🌟 Acknowledgments

🔗 Links

💖 Support the Project

If you find this project useful, please consider giving it a ⭐️ on Github and sharing it with your friends!