TOC

前言

博客中使用图片是一件很常见的事情,那么图片优化你是怎么做的呢?

我假设我计划做这件事情那么我可能会这样执行:

1. 寻找可以优化图片的工具,保证优化后图片尺寸可以不变而文件大小会比之前小,保证图片质量不会降低太多
2. 有了工具之后寻找自动化的方案,例如手动写脚本,把这件事情放在 Github Action 当中.

看起来只有两件事,但是真正去做这两件事情的时候可能会遇到很多细节的问题,一切都得自己寻找答案.

但在认识 imgbot 之后,你会发现做好优化图片这件事情简直不要太简单了.

imgbot

好处

作为一个 github app 运行，只需要点击几下就能应用上

安装起来!

首先打开 在 github marketplace 中找到 imgbot,传送门

然后会跳转到 github 登录授权页面,选择性地添加你的博客仓库

安装完成后过一段时间 imgbot 会给你的仓库提交它的第一个PR.这里给一个参考信息, imgbot 给我博客提交的第一个PR是过了大概四个小时.

似乎在官网上可以主动让 imgbot 检测图片优化.

下面是 imgbot 给我的博客仓库提交的第一个 PR:

由于是第一次因此修改的文件还是挺多的,可以点击Detail来展开查看具体图片优化后的变化.

到这里为止你已经为你的博客仓库安装了 imgbot 这款 github apps,后续只要你仓库有可以优化的图片,那么 imgbot 就会自动的提交优化图片的 PR,你只需要决定是否需要合并就可以了.

对于高级用户,你可能有一些图片不想被优化,只需要在你的仓库添加一个.imgbotconfig文件就可以了.具体可以看看官网文档.

主要的几个配置内容:

• 图片优化程度,默认是无损压缩,也可以配置成有损压缩.
  
• 过滤文件,哪些文件不希望被imgbot优化, 默认是没有过滤的
  
• 优化间隔, 配置多久执行一次,比如在不希望太频繁imgbot提交PR的情况下可以配置一星期一次
  

一个参考信息:我的博客使用的是默认的配置,因为这已经足够我的需求.

自动化合并imgbot的PR

在有了 imgbot 这个图片优化神器,如果把时间线拉长就会知道总是需要手动去合并 imgbot 的 PR.

那么很自然的就会想到把这个过程自动化.

这里列出两个方案:

1. 直接用 github action 来做,判断作者是 imgbot 即用 gh 命令把这个 PR 合并.简单粗暴.
2. 使用 Mergify,更强大的自动化 PR 合并方案

Mergify 是另一个 github app,专注于自动化合并 PR 这件事情上,我的 repo 使用的是 Mergify 这个方案.因为我不仅仅是需要自动化合并 imgbot 的 PR,我自己的 PR 或其他人的 PR 也需要有一个比较好的方案,比如当 PR 有 approved 标签时合并这个 PR.

既然已经有了 Mergify,自然就无需花费时间去造轮子了.

我可以本地运行imgbot吗?

imgbot 是开源的,并且实际服务运行在 Azure Function 之上,官网文档中 https://imgbot.net/docs/#contributing 明确说到是可以本地运行的.不过这不在我的需求范围内,因此我没有进一步研究在本地使用 imgbot 要如何操作,如果你已经研究了这一部分欢迎投稿或与我交流:)

最后

imgbot 对于博客 repo 来说就是一大神器,即可以做好图片优化这一件事又可以让这件事情不给 repo 的拥有者带来太多的压力.

现在,你的静态博客拥有了自动化优化图片的功能,再多一个阅读本文需要x分钟的功能不过分吧?

• 给hugo博客添加字数统计和阅读需要xx分钟的功能

再多一个自动化构建 algolia 索引不过分吧?

• 自动构建algolia索引

再多一个评论的功能不过分吧?

• 给hugo博客添加评论功能

微信公众号

扫描下面的二维码关注我们的微信公众号,第一时间查看最新内容。同时也可以关注我的Github,看看我都在了解什么技术,在页面底部可以找到我的Github。

---