https://github.com/abdullah-w-21/squish
browser-based image compression tool that respects your privacy
https://github.com/abdullah-w-21/squish
browser-based-tool image-compression image-converter jpeg-image-compression jpg jpg-compressor png-compression webp webp-converter
Last synced: 9 months ago
JSON representation
browser-based image compression tool that respects your privacy
- Host: GitHub
- URL: https://github.com/abdullah-w-21/squish
- Owner: abdullah-w-21
- License: mit
- Created: 2024-12-27T17:58:14.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-12-29T08:09:36.000Z (about 1 year ago)
- Last Synced: 2025-02-04T14:45:56.859Z (11 months ago)
- Topics: browser-based-tool, image-compression, image-converter, jpeg-image-compression, jpg, jpg-compressor, png-compression, webp, webp-converter
- Language: HTML
- Homepage: https://squishh.vercel.app
- Size: 152 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# Squish 🎯
A lightning-fast, browser-based image compression tool that respects your privacy. Compress and convert images instantly without uploading them to any server.
[](https://vercel.com)
[](https://opensource.org/licenses/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](https://squishh.vercel.app)
## 🛠️ 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
- [HTML5 Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
- [Modern JavaScript Features](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
- [Web File API](https://developer.mozilla.org/en-US/docs/Web/API/File_API)
## 🔗 Links
- Project homepage: [https://squish.vercel.app](https://squishh.vercel.app)
- Repository: [https://github.com/abdullah-w-21/squish](https://github.com/abdullah-w-21/squish)
- Issue tracker: [https://github.com/abdullah-w-21/squish/issues](https://github.com/abdullah-w-21/squish/issues)
## 💖 Support the Project
If you find this project useful, please consider giving it a ⭐️ on Github and sharing it with your friends!