Pic Smaller：简单易用的在线图片压缩工具

本文介绍 Pic Smaller（图小小），一款简单易用的在线图片压缩工具。该项目支持智能压缩 JPEG、PNG、WEBP、AVIF、SVG 和 GIF 图片，采用纯本地压缩技术，无需服务器端处理，完全安全可靠。

项目简介

Pic Smaller 是一个开源的图片压缩工具，由 joye61 开发。截至目前，该项目在 GitHub 上已获得 2.7k stars，是前端开发者和设计师常用的图片优化工具。

与其他在线压缩工具不同，Pic Smaller 采用纯浏览器端压缩技术，利用现代浏览器的 OffscreenCanvas、WebAssembly 和 Web Worker 等技术，所有压缩操作都在本地完成，图片不会上传到任何服务器，确保用户数据安全。

核心特性

多格式支持：支持 JPEG、PNG、WEBP、AVIF、SVG、GIF 图片格式
智能压缩：自动执行最佳压缩算法，提供详细的压缩结果
自定义配置：支持设置输出格式、颜色数量等参数
图片裁剪：支持图片裁剪功能
对比工具：拖拽对比原图和压缩后的差异
批量处理：支持同时上传和压缩多张图片
响应式设计：网站和移动端友好
纯本地处理：无需服务器端逻辑，完全安全
快捷键支持：支持 Ctrl+C/Ctrl+V 复制粘贴上传

技术栈

Vite - 构建工具
React - 前端框架
TypeScript - 编程语言
OffscreenCanvas - 离屏渲染
WebAssembly - 高性能计算
Web Worker - 后台线程处理

在线使用

Pic Smaller 已部署到 Vercel，可直接访问使用：

国际用户：https://pic-smaller.vercel.app
国内用户：https://picsmaller.com

注意：旧域名 txx.cssrefs.com 已于 2025-02-22 过期，请使用新域名访问。

安装指南

方式一：在线使用（推荐）

直接访问 https://picsmaller.com 即可使用，无需安装。

方式二：Docker 部署

bash

# 克隆仓库
git clone https://github.com/joye61/pic-smaller.git
cd pic-smaller

# 构建 Docker 镜像
docker build -t picsmaller .

# 启动容器
docker run -p 3001:3001 -d picsmaller

访问 http://127.0.0.1:3001 即可使用。

方式三：源码运行

前置要求：Node.js >= 20.17.0

bash

# 克隆仓库
git clone https://github.com/joye61/pic-smaller.git
cd pic-smaller

# 安装依赖
npm install

# 启动开发服务器
npm run dev

按住 Ctrl 并点击终端中显示的 "Local:" URL，即可在浏览器中打开。

快速开始

打开工具 访问 https://picsmaller.com 或本地部署的地址。
上传图片
- 点击上传区域选择图片
- 或直接将图片拖拽到页面
- 或使用 Ctrl+C/Ctrl+V 粘贴图片
自动压缩 上传后，工具会自动进行压缩，显示压缩前后的对比信息。
自定义设置 在右侧设置面板中，可以调整：
- 输出格式
- 颜色数量
- 压缩质量
下载结果 点击下载按钮，保存压缩后的图片。
对比查看 使用拖拽对比工具，查看原图和压缩图的差异。

使用示例

场景一：网页优化

将网站需要使用的图片批量上传到 Pic Smaller
工具自动压缩，通常可减少 50%-80% 的文件大小
下载压缩后的图片，替换原图
提升网页加载速度

场景二：设计稿导出

从设计软件导出 PNG/JPEG 图片
使用 Pic Smaller 压缩
转换为 WEBP 格式获得更小体积
用于网页或移动端展示

压缩效果

格式	典型压缩率	适用场景
JPEG	60%-80%	照片、复杂图像
PNG	40%-70%	图标、透明背景
WEBP	70%-90%	现代浏览器首选
AVIF	80%-95%	超高压缩需求
SVG	10%-30%	矢量图形优化
GIF	30%-60%	简单动画

技术亮点

纯本地处理

Pic Smaller 的所有压缩逻辑都在浏览器端执行：

图片不会上传到服务器
保护用户隐私和数据安全
无需网络连接即可使用（PWA 支持）

现代浏览器技术

OffscreenCanvas：在 Worker 线程中进行图像处理
WebAssembly：高性能压缩算法
Web Worker：后台处理，不阻塞 UI

注意事项

建议使用现代浏览器（Chrome、Firefox、Edge、Safari）
大图片压缩可能需要一定时间，请耐心等待
压缩效果因图片内容而异，复杂图片压缩率相对较低
建议保留原图备份，以防压缩效果不理想

项目链接

GitHub 仓库：https://github.com/joye61/pic-smaller
在线使用：https://picsmaller.com
问题反馈：https://github.com/joye61/pic-smaller/issues