唉，一年了无人问津，开源算了

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 198 天前的主题，其中的信息可能已经有所发展或是发生改变。

最近重构了我的个人项目图小小（ Pic Smaller ），无论是技术上还是 UI 上都进行了重构，改动巨大，这次我决定完全开源它（ Github 地址在文末）。因为之前跑了一年几乎无人问津，它一直是一个完全免费项目，没有广告，没有打赏，甚至联系方式都没有，做成这个样子属实让人很不甘，所以干脆完全开源算了，希望能吸引一些关注，先看看新版本预览效果：

图小小是一个图片压缩工具，基于 Vite+React 技术栈开发，它可以完全取代类似 TinyPNG 之类的在线图片压缩工具，且压缩之后视觉表现效果往往更好。但图小小有个更大的优势：通过图小小进行图片压缩完全是基于浏览器本地的，没有任何服务端交互，图片不会上传到远程服务器，所以非常安全，不用担心隐私图片被泄露。

目前图小小支持 JPEG/PNG/WebP/Gif 四种格式的图片压缩，基本上能满足绝大部分日常使用需求，本项目为个人业务时间开发，为了节约时间，采用了大量的第三方开源项目，所以图小小本身是没什么技术含量的，我个人认为图小小优秀在于提供了良好的 UI 和使用体验，虽然是缝合怪，但鲜有人做出类似的产品

技术实现

JPEG/WebP 压缩：利用了现代浏览器自带的功能，叫离屏渲染技术 OffscreenCanvas
PNG 压缩：采用了一个第三方的 Webassembly 实现，底层是 libPNG
Gif 压缩：采用了一个第三方的 Webassembly 实现，底层是 Gifsicle

简单说一下技术实现，感兴趣的自行研究，不得不感谢 Webassembly 技术的加持，让 PNG/Gif 编解码这类 CPU 密集计算型需求在纯网页端实现成为了现实，并且还有不错的性能表现

为了防止 UI 阻塞，运用了 Web Worker 技术进行编解码和压缩，同时为了防止同一时刻浏览器的内存占用过大（内存占用过大也会导致卡顿），用了一点小技巧在 Worker 端实现了一个简单的队列 Queue，这里不展开，有兴趣的自行研究源码

部署实现

网站部署在 vercel 上，主要原因是穷，所以初次访问速度会有一定的影响，国内其实大部分地区已经屏蔽了 vercel ，为了让国内用户也能访问，不得已通过 Cloudflare 做别名解析了 txx.cssrefs.com 这个域名。这里要强烈推荐个人开发者采用国外的解决方案，这个网站除了域名（域名是以前在腾讯云买的），其他证书服务器等都是免费的，感谢万恶的资本主义

不足之处

由于图小小是纯本地执行，因而不同的电脑配置会有不同的压缩表现，实测批量压缩成百上千张图片会有明显的卡顿甚至浏览器崩溃现象。这是正常的，由于没有任何限制，使用本工具可能会导致浏览器耗尽 CPU 和内存资源，所以使用时请自行评估

项目地址：https://github.com/joye61/pic-smaller

122 条回复 • 2024-08-29 10:42:35 +08:00

1 2

❮

❯

EmbraceQWQ

198 天前

https://www.toolcat.cloud/ 收录你的，感谢你的付出

sfqtsh

198 天前 via Android

我的主手机 iPhone 刚好前几天在 app store 里买了个图片压缩的应用，一些拍的好多 M 的图片压缩后小了很多，质量看起来差不多。我觉得这类放在手机上需求更大点更能赚 money 吧

Admstor

198 天前

1 使用 web 工具的用户往往不是隐私敏感型，你的纯浏览器处理模式与同类产品并无明显优势

2 界面复杂明显并没有做到简单易用。从用户角度看，当我需要用压缩的时候，往往是要么体积或者分辨率的限制，所以其实对这些用户，他们需要的是，我上传一个照片，你返回一个符合我要求的压缩后照片，而不是让我选所谓的压缩率等等参数

3 批量处理用户会选择更专业的软件，而不是选择 web 工具

4 你这个东西更适合作为某个比较大型的 web 项目，其中一个组件，指望赚钱或者广告流量，你除非做个站点，全都是类似的 web 工具库，才有可能。但是说实在的，竞争压力依然巨大，同样市场极小。

lizhenda

198 天前

确实很难商业化

joye

198 天前

@Admstor 感谢建议，说的很对。我会抽时间优化功能，采纳你的建议，我今年 37 岁了，公司面临倒闭，马上要离开职场了，只想让自己以后能留下一点技术的回忆，这个工具太小，永远不为赚钱，只为有人使用，有人记得就足够

angrylid

198 天前 via Android

如果流量达标了，光贴广告应该是能赚到钱的，进阶一点的话还可以搞社区和云存储等增值服务。

不过第三方库为什么是以二进制加入到版本控制里的方式来管理？

joye

198 天前

@angrylid Webassembly 技术

osilinka

198 天前

推广不好吧，记得一个人在 reddit 的 sideproject 推广类似的，一个月有几百美元的收入

MaizerShuahu

198 天前 via Android

我经常有需求需要使用网站压缩图片，目前你做的网站对我来讲有一些体验上的问题
1.一打开就要上传图片，不能进行我想要的质量设置
2.一般我找网站压缩，都是求保质的，也就是说我期望压缩的更小，而质量可以接近原图，否则我用 ps 也可以搞定，而我使用了之后发现质量变化太大，无法达到预期

syozzz

198 天前

感觉很像这个 https://squoosh.app/

xhawk

198 天前 via Android

我最近有个跟这个相关的需求场景跟你分享，电商里头的图片管理，要解决 2 个问题，图片的存储管理，图片的打标签分类，你这属于高级功能，需要能对图片做基础编辑，因为亚马逊会对图片严格审核，需要能对图片的信息重新组织。

TuTouPower

198 天前

@xhawk 可以联系，RmVpS2FpNjgyMw==

wlf92

198 天前

有个产品叫 PP 鸭，我愿意付费，因为只要把文件夹拖进去就会遍历所有图片进行压缩了。
题主可以借鉴一下他的设计和商业模式。

BeijingBaby

198 天前

挺好的，可自定义压缩率

MillaMaxwell

198 天前

试用一下，感觉如果我想处理大量图片还是不够方便

jisuowei

198 天前

这就不得不提到以前公司做的 https://tuya.xinxiao.tech/

InsideSeed

198 天前

已 star 支持

sundev

198 天前

star 支持

abccccabc

198 天前

兄弟，能不能 build 一个，我是做后端的，对压缩也挺感兴趣的。

再去学一遍前端，可能性不大。

zhuang0718

198 天前

为开源点个赞~

zhangkui

198 天前

star 支持

googlehub

198 天前

已 star ，感谢楼主的开源，看着挺不错的，还可以有更多优化的空间，慢慢打磨下，更专业体验更好的方向试试呢。

zhangyl

198 天前

star 支持

SunsetShimmer

198 天前

@abccccabc 用 Vercel 部署一下就可以吧，前端好像一般没有发布 build 的习惯

daimao

198 天前

不是哥们你这网站打开了连个功能介绍都没有谁知道是干嘛的啊

DefoliationM

198 天前 via Android

这种简单的东西其实很多都是自己写着玩玩，感觉很难火起来。

c330

198 天前

兄弟，感觉你可以试着把它搞成插件的形式，然后上架卖出。（地址： https://www.zentao.net/redirect-index-24073.html)

jellyX

198 天前

大佬加油

ttyhtg

198 天前 via Android

加油

c330

198 天前

@c330

moreant

198 天前

支持批量真不错，之前都是用 squoosh.app ，只能一张一张压缩有点烦

iorilu

198 天前

我也有个站点在 vercel , 能说说看怎么用 Cloudflare 加速国内访问吗

theprimone

198 天前

好奇 OffscreenCanvas 怎么实现 JPEG/WebP 的压缩的，找个算法重绘 Canvas 再导出？

seedhk

198 天前

已 star ，感谢楼主的开源

me1onsoda

198 天前

@abccccabc 这也太伸手了吧。。这玩意还得叫人给你打包一份

abccccabc

197 天前

@me1onsoda
@SunsetShimmer

隔行如隔山呀，我主要写 php 的，不写前端 JS 。说实话，vue 都看得我一 meng 一 meng 的，现在又冒出一个 Vercel ，又是 react ，又是编译。

算了，不扯了，不玩了。

walkingmoonwell

197 天前

这样部署的话，那你这个域名是不是就不用备案了

huihushijie1996

197 天前

谢谢你开源的我一直想自己弄一个。这下方便了嘿嘿

谢谢了

flyyu

197 天前

@xhawk 可以详细说说这个需求吗，我看下我的网站能不能做这种 cWl1eXUzMDNAZ21haWwuY29t

skyworker

197 天前

正好需要在内网部署一个类似的工具, OP 可以放 buy me coffee 的二维码, 我愿意赞助

zealotxxxx

197 天前

压缩率很不错啊，而且看着很可以。
不过产品对于有需求的轻量用户来说，还是偏复杂了。
收藏了，这个挺好用的。比 tiny 还好点。

dylan593

197 天前

看了一下该站点的域名是 19 年就开始使用的，下面是我作为 PM 给楼主一些优化建议：
1. 简化用户操作步骤，让用户以上传图片——等待压缩——下载图片的工作流进行体验（可通过自行测试设置一个默认参数，保证压缩体积与图片质量的平衡）；
2. 优化板块布局，上传页面还可以，下载页面的下载按钮应突出展示，另外压缩的比例以及具体数值可以在下载按钮上方进行展示；
3. SEO 优化，你的标题、元描述、关键词等内容都存在优化空间，另外爬虫文件也没设置，这样对于自然流量的获取会很吃亏；
4. 营收点：通过数据分析了解用户上传图片的主要体积大小范围，设置分级收费制度，如 50M 以上的图片上传处理需要收费；
以上是个人看完你的网站后的一些思路，希望对你有帮助。

giyear

197 天前

压缩图片绝大部分目的就是为了传播吧，你这个巨大的隐私优势完全无用武之地……

AmaQuinton

197 天前

op 有没有考虑通过 url 方式获取图像文件，例如 B 站的壁纸

rlds

197 天前

挺好的，支持！！！

rookie2luochao

197 天前

害，我也重复造了个新 swagger-ui 的轮子，也是无人问津，还好我的 UI 设计和使用体验和其他竞争者大部分不一样，不然我真的好像是抄袭了，至少我没出圈我也不至于被吐槽吧😂，其实早就完成了 60%，但是没有设计成通用的开源包，我要是早 2 年放出来估计好很多，我给 swagger-ui 也成立了一个组织用于收录所有后端语言的 swagger-ui, 链接在下面

核心 UI 包： https://github.com/rookie-luochao/openapi-ui
后端 swagger-ui 中间件： https://github.com/openapi-ui

skyworker

197 天前

@giyear 为了传播的用户, 一般不会付钱

比如商业用户, 需要保护图片隐私, 不会使用网络工具, 如果能够定制化(比如增加 AI 功能, 符合特定行业对图片处理的需求, 比如自动加用户水印之类), 我觉得商业化不是问题.

Xinu

197 天前

很棒！

chf007

197 天前

squoosh 不香么，同类的还有很多种，这种工具太多了，没有什么特别的优点很难胜出

LowBi

197 天前

支持太难了我想也让濒死/死亡项目开源留下最后的痕迹

polobug

197 天前

另外你这个如果能在小程序那才能获取流量。

yuyuf

197 天前

感觉稍微缺少的用户思维。
1 、调整图片尺寸那里。适应宽度，适应高度、这些词，普通用户大概率是不知道什么意思的。
2 、图片质量那里。可以就给几个选项就行了，
等等，下面的那些参数，普通用户也基本都不知道是什么意思的。可以都设置为默认，隐藏起来。给个高级选项按钮，给专业人用。普通用户就用默认的就好了

cndenis

197 天前

现在产品太难, 别说免费, 贴钱给用户人家都不见得会肯用.

靠技术和功能来吸引用户真要做得非常独到才行

这几年我在桌面上使用的新工具软件, 每年可能就一两个而已

joye

197 天前

@dylan593 作者是个程序员，产品思维很缺，我会认真考虑你的建议，谢谢

Grefer

197 天前

star 支持一下，加油

joye

197 天前

@daimao 已采纳

joye

197 天前

@walkingmoonwell 是的

insignificance

197 天前

给你点个赞

joye

197 天前

@AmaQuinton 当前技术无法实现，由于采用的 Vite ，它是一个非常纯粹的前端 SPA 项目，在技术上会存在 [跨域和画布污染]( https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image) 的问题，因为前面有人提到 SEO ，所以等有时间我会考虑用 nextjs 实现，就可以做到通过 URL 获取图像文件，但本质上是借助于服务器实现