Squish 基于浏览器的图像压缩工具

Squish 是一个现代的、基于浏览器的图像压缩工具，利用 WebAssembly 实现高性能的图像优化，支持多种格式，提供了一个直观的界面，可以在不牺牲质量的情况下更有效率的压缩图像。

支持多种图像格式：包括 AVIF（AV1 图像格式）、JPEG（使用 MozJPEG）、JPEG XL、PNG（使用 OxiPNG）和 WebP。

关键功能：

• 基于浏览器的压缩（无需服务器上传）

• 支持批量处理

• 格式转换

• 每种格式的质量调整

• 实时预览

• 文件大小减少统计

• 大量文件的智能队列

Squish 使用现代的 Web 技术构建：

• 使用 React 和 TypeScript 构建用户界面

• 使用 Vite 进行快速开发

• 使用 WebAssembly 进行本地速度的图像处理

• 使用 Tailwind CSS 进行样式设计

• 使用 jSquash 进行图像编解码实现

使用指南

前提条件

• Node.js 18 或更高版本

• npm 7 或更高版本

安装

1、克隆仓库：git clone https://github.com/addyosmani/squish.git

2、进入目录：cd squish

3、安装依赖：npm install

4、启动开发服务器：npm run dev

5、构建生产环境：npm run build

使用方法

拖放或选择图像：将图像拖放到上传区域或点击选择文件。

选择输出格式：选择所需的输出格式（AVIF、JPEG、JPEG XL、PNG 或 WebP）。

调整质量：使用质量滑块在文件大小和图像质量之间取得平衡。

下载：下载单个图像或使用“下载全部”按钮进行批量下载。

默认质量设置

• AVIF：50%

• JPEG：75%

• JPEG XL：75%

• PNG：无损

• WebP：75%