让DeepSeek帮我的Blog瘦身，减少85%附件体积！
- 2025/02/07
- 0阅读
刚写完4600字的重庆篇游记，这次文章贴图数量突破了40张，附件体积达到了136MB，这即使传到TinyPNG压缩再转webP，恐怕最后也有个50MB。得想想办法优化一下了。
图片&视频加起来有136MB
突然想起前几天在博友圈看到一篇游记，发现该博主的图片加载特别快。起初以为是用了CDN加速，后来打开浏览器的控制台发现，他把图片处理得很好——每一幅图的最大宽度都控制在了1024像素左右，所以图片体积大大减小。相比之下，我之前传的照片质量虽然有压缩，但因为没有限制大小，每张照片几乎都是2K的分辨率，在压缩后还是有500~1000KB。
成都篇里通过TinyPNG压缩的图片仍有583KB
一、代码生成
正巧最近DeepSeek爆火，那就让AI帮忙写个Hexo插件吧，试试它的Code能力与GPT-4o相比如何。
灰色高亮块是我的提示词内容，开启DeepSeek-R1深度思考功能。
请帮我写一个hexo插件，我的node版本是18.14.0，hexo版本是7.1.0。
需求是：
1、以命令行的形式，通过指定slug名称来压缩文章对应的图片附件尺寸和图像质量。
2、请将非gif格式的图片压缩为webp格式，并修改md文件中的引用信息。
我的文章附件目录结构时这样的：例如slug=A的文章，其文章位置为source/_posts/A.md，其附件位置为source/_posts/A/。
下图是开启了深度思考后，看到AI推导时的“内容”。因为这些事项的顺序是我主动提到的，所以输出这些内容都还在我的预期内。
接下来他又考虑到了这个需求背后隐藏的一些深层问题，甚至还帮我做了一些额外优化。
它生成了第一版代码，一遍跑通没有问题。我又针对它之前的思考内容，完善了规则要求。
我看了你的思考过程，有几点需要补充
1、我希望你在附件目录下创建一个.origin的文件夹，存储原始图片附件（我会视情况考虑是否删除.origin文件夹）。
2、你仍需要考虑在window下，分隔符的兼容处理。
3、图片引用为形式，不会包含slug目录。
它几乎完美的理解了我说的需求，并将其实现了。然后我又提了一个问题（这是我之前没有主动说出的需求，在事后才想到会有这种特殊场景）
你提供的代码里有特殊处理“图片宽度小于预设尺寸”的情况吗？我希望这种情况下只需要压缩图像质量，不要把图片尺寸放大。
没想到第一版代码就已经实现了
事后又想到了第二个漏掉的场景，又开始提问。
我现在希望把webp格式也加入转换，因为之前存在一些大尺寸的webp图片
这一轮调整思路都对，但是因为文件路径和生成路径一致，导致sharp处理时报错了。
对于webp文件的处理似乎有问题，报错为Cannot use same file for input and output。是不是可以先移动，再使用移动后的图片路径去压缩，然后将压缩后的图片生成到附件目录下，再修改md文件的引用？
AI将这问题搞复杂了，它额外用了一个backupPath变量去记录一个带有操作时间戳的原文件路径，并将已经备份过一次的originalPath复制到backupPath进行再次备份，再使用backupPath来读取文件进行压缩。
其实这问题最简单的改法就是把await sharp(backupPath)改为 await sharp(originalPath)，只要原文件路径和目标生成路径不一致就行。
虽然DeepSeek在最后犯了一些小错误，但至少它在40分钟的时间内帮我实现了一个Hexo插件，也没有陷入到反复调试问题的局面中，我还是非常满意的！（如果不是这几天DeepSeek服务经常不可用，我感觉最短20分钟就能完成这项工作，DeepSeek给力啊！）
二、插件效果测试
拿这次的重庆游记做测试，原文件夹大小为136MB，压缩完后仅剩16.2MB！减少了88%的附件体积！如果仅算图片体积的话，减少了91.6%！(131MB→11MB)
命令行转换过程
压缩完后只有16.2MB
附：Blog的其他变化
（1）高亮块已支持插入图片
问题原因：高亮块功能是通过正则提取内容，然后使用hexo.render.renderSync渲染来实现的，由于Hexo启用了post_asset_folder配置后只需要使用相对路径，导致这一步渲染就会找不到图片附件。
知道问题就好修复了，通过在hexo.render.renderSync后又执行了一次img图片路径提取替换(加入文章路径前缀)，成功实现高亮块中展示图片的效果。
原本因为插件BUG不支持高亮块展示图片
目前在重庆篇中已经支持辣！
（2）足迹页面样式改版
原本各省份的配色，是我在百度图片里找了一份中国地图，根据其配色来设置的。观察地图无法轻易看出到过哪些省份，现在调整为“默认将各省份置灰，给已游玩过的省份上色”，整体视觉上会清晰不少。
