2023 年图片 CDN——Cloudflare Polish, Bunny Optimizer, Vercel Image Optimization, imgproxy 和 WebP Cloud Services 对比

This article is also available in English, at Comparison of 2023 Image CDNs — Cloudflare Polish, Bunny Optimizer, Vercel Image Optimization, imgproxy, and WebP Cloud Services.

图片优化，对于 CDN 来说可能已经是一个比较常见的附加服务，用户在给自己的网站选择 CDN 的时候可能也会开启相关的「图片优化」功能，这里的优化一般有如下：

• 通过传入 width 等参数对图片进行缩放，裁剪
• 传入 lossy=1,q=80 等参数决定图片应该按照什么样的质量转换
• 尽量将图片转换成 WebP/AVIF 等更适合 Web 展示的图片来减小图片体积

在我们的 WebP Server Go 开源项目问世之前，用户想要获得类似的图片转换功能几乎只能选择使用 CDN 的附加服务，或者通过在本地将图片完成转化后上传到网站上（且还需要考虑对于老版本浏览器的兼容情况），WebP Server Go 旨在给用户提供一个不使用 CDN 的开源解决方案。

不过在我们和用户的沟通过程中，发现部分用户可能没有自己托管服务器的能力或计划（例如使用了 Hugo/Hexo 等静态网站框架），或者觉得自己手动处理 WebP Server Go 的安装/维护较为麻烦，为了解决这个问题，我们在最近三个月做了个 SaaS 产品，被称为 WebP Cloud，让用户可以简单地用类似 CDN 的使用方式体验到图片优化的效果。

我们知道，一旦涉及到 SaaS 和类似 CDN 的功能，那我们就涉足了一个非常卷的行业，本文我们选择一些主流的带相关功能的 CDN 厂商，将 WebP Cloud 和他们一起，对相关的产品进行横向对比。

价格对比

功能对比

上面的对比中，我们发现如果要使用对应的功能，有的服务商需要修改 NS 到 CDN 提供的地址，这样的缺点在于接入的时候容易产生下线时间，且 CDN 的 NS 可能不具备某些特性（例如 Route 53 支持分区解析，而 Cloudflare 的 NS 不支持），但是优点在于如果已经修改了 NS 且网站都已经通过对应 CDN 服务商提供的话，那么启用对应的功能几乎是一键的。

而如果不使用 NS 接入的话，一般 CDN 都会提供一个额外的域名，或者允许使用用户自己的额外的域名，例如原本图片地址是：

https://www.cnx-software.com/wp-content/uploads/2023/07/ESP32-S3-Linux-6.3-720x390.jpg

可能就需要换为：

https://cdn.cnx-software.com/wp-content/uploads/2023/07/ESP32-S3-Linux-6.3-720x390.jpg

对于这种情况来说，要方便用户的接入就需要服务商提供额外的工作，比如提供 Wordpress 插件，提供一些替换脚本和教程等，需要修改网站上原有的标签属性。

Cloudflare Polish

文档： https://developers.cloudflare.com/images/polish/

Cloudflare Polish 的服务并不能单独购买，需要购买 Cloudflare Pro Plan （每个域名 $25/mo）之后获得，

Polish 的功能是将图片转换成 WebP 格式，可以选择的选项有是否使用 Lossy 转换，没有别的其他的（例如生成缩略图）的功能，优点在于只要买了 Pro Plan 之后不会有额外的图片上的限制，缺点在于必须网站全部使用 Cloudflare 才可以使用（需要修改域名的 NS 为 Cloudflare 的），对于已经开始使用 Cloudflare 的域名，且只有图片优化需求的用户来说非常合适，但如果有一些额外需求（比如不希望使用 Cloudflare 作为 CDN，或者有生成缩略图功能的需求的话）的话可能就不太合适了。

Cloudflare 有另外一个产品，称为 Cloudflare Image Optimization ，文档： https://developers.cloudflare.com/images/ ，这个是一个额外的付费服务，不需要购买 Cloudflare Pro 也能使用，需要将图片后面传入一些地址的方式，例如：

<img src="/cdn-cgi/image/width=80,quality=75/uploads/avatar1.jpg" />

或者

/cdn-cgi/image/width=100/<https://s3.example.com/bucket/image.png>

但是缺点和上面所述的一样，需要整个域名接入 Cloudflare 才能使用，价格是 $1 per month per 100k images delivered。

Bunny Optimizer

文档： https://docs.bunny.net/docs/stream-image-processing

BunnyCDN 的 Bunny Optimizer 是作为一个附加产品提供的，用户要使用的话不需要修改 NS ，只需要在 BunnyCDN 上创建域名并启用这个产品即可，和 Cloudflare 不同的点在于如果使用 BunnyCDN 的 Bunny Optimizer 做图片优化输出的话，除了每个月 $9.5 的固定费用以外，还会额外支付流量费用（使用 Cloudflare 则不需要支付任何流量费用）

BunnyCDN 的特点非常明显，就是他们支持非常多的参数，可以对图片进行各种操作，例如裁剪，翻转，模糊，锐化等（通过传入 ?blur=0,?crop=3500,3500 等参数），不过并不支持图片水印功能。

此外，Bunny 公司名为 BunnyWay d.o.o.，是一个斯洛文尼亚的欧洲公司。

EWWW Image Optimizer

文档： https://docs.ewww.io/article/4-getting-started

这个产品感觉比较神奇，他们官网 https://ewww.io/ 上的图片地址基本都是 ewtbsxzkfw9.exactdn.com 开头，例如：

https://ewtbsxzkfw9.exactdn.com/wp-content/uploads/2022/09/ft1.png?strip=all&lossy=1&ssl=1&fit=523,489

且从响应 Header 来看似乎使用了 BunnyCDN

不确定是否是直接使用了 BunnyCDN 的 Optimizer，不过相比较 Bunny 而言，他们提供了一些插件，比如 Wordpress 插件 https://docs.ewww.io/article/4-getting-started

（有意思的是，上面文档中的图片地址都是：d33v4339jhl8k0.cloudfront.net 开头的地址，比如：

https://d33v4339jhl8k0.cloudfront.net/docs/assets/57c6eee1c69791083999e671/images/5c5b2c0c2c7d3a66e32e169e/file-ERskC5hGyx.png

感觉这个产品似乎不喜欢「吃自己的狗粮」。

Vercel Image Optimization

文档： https://vercel.com/docs/concepts/image-optimization#source-images

Vercel 和 NextJS 关系紧密，所以这里的 Image Optimization 功能也是为了托管在 Vercel 上的 NextJS 站点提供的，

一个典型用户是 Mirror.xyz，例如对于这个文章页面： https://dev.mirror.xyz/Jn62zF5n62BfowdaFgm3uIx3Fgp2vIR7b-HTSxKVXqk 来说，上面的图片地址是：

https://dev.mirror.xyz/_next/image?url=https://mirror-media.imgix.net/nft/7WubHdcduGYqO3uKL4JSz.png?h=null&w=null&auto=compress&w=640&q=75

从地址中可以看出他们的原图是：

https://mirror-media.imgix.net/nft/7WubHdcduGYqO3uKL4JSz.png

接入的方式是通过在 URL 后面加入 /_next/image?url= 的方式，根据 Vercel 的文档来看如果你是使用的 NextJS，那么只要在定义图片的地方按照如下写法：

<Image src="/hero.png" width="700" height="745" />

就会在输出的时候自动对图片进行优化，所以对于已经在使用 NextJS + Vercel 的用户来说有了非常好的体验，但是这个服务并不是个通用的服务。

imgproxy.net

网站： https://imgproxy.net/

用法和 Vercel 的 Image Optimization 类似，不过是个比较通用的服务，一个比较典型的用户是 https://dev.to/ ，例如页面上有图片地址如下：

https://res.cloudinary.com/practicaldev/image/fetch/s--ZU-2axST--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f8afrf5y9mwf4uq3ss1o.png

实际原图地址为：

https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f8afrf5y9mwf4uq3ss1o.png

可以看出也是通过拼接一些参数的方式进行接入，和 WebP Cloud 一样底层使用了 libvips 作为实际的转换引擎。

这个公司的服务似乎是我们对比的服务中价格最贵的一个，最低价格的 Plan 是 499USD 一年。

WebP Cloud Services

文档： https://docs.webp.se/

这个是我们最近两个月在做的新服务，其主要功能是：在不需要用户自己托管我们的开源组件 WebP Server Go 的情况下（尤其适合静态博客例如 Hugo， Hexo 等）

通过在 WebP Cloud 上注册一个帐号并填入自己网站地址，WebP Cloud 会给出一个新的域名，当用户使用新的域名和自己网站的图片地址（URI）访问图片时，WebP Cloud 会将图片转化成 WebP/AVIF 格式并输出，在几乎不改变画质的情况下大幅缩小图片体积，加快整体站点加载速度

例如你的网站原始图片地址是 https://yyets.dmesg.app/api/user/avatar/Benny ，WebP Cloud 会给出一个 https://vz4w427.webp.ee 的地址，此时只要访问 https://vz4w427.webp.ee/api/user/avatar/Benny 即可看到被压缩处理后的图片

我们的收费模式是：不限制访问流量，只针对图片访问数量进行收费。

免费用户每天可以获得输出 2000 张图片的免费额度，且可以创建三个 Proxy，每个 Proxy 可以有 100MiB 的不会被清理的缓存。

• 这个额度已经可以支持一些访问量不是很大的网站/博客使用，如果可能有突发流量的话，可以以较低的价格购买付费额度（类似手机额外的流量套餐，永不过期，如果某一天免费额度用完了的话会自动从付费额度中扣除）。

此外，我们还提供两个订阅服务，分别是：

• Lite，目前暂定价格是 $3/mo，Plus 用户可以创建 6 个 Proxy，且每天的输出额度会变成 5000 张，且每个 Proxy 会获得 512MiB 不会被清理的缓存。
• Plus，目前暂定价格是 $10/mo，Plus 用户可以创建 10 个 Proxy，且每天的输出额度会变成 15000 张，且每个 Proxy 会获得 1024MiB 不会被清理的缓存。

缓存的意思是：所有输出过的图片会默认缓存在 WebP Cloud 中（不会过期，除非用户手动清理缓存，或者你的缓存空间用满了），这意味着第一次访问之后的所有访问都会直接从 WebP Cloud 输出，不会再次回源，源站不会有任何额外的流量和带宽的压力。

由于接入我们服务并不需要将 NS 切换为我们的（事实上我们也没有自己的 NS 服务器），所以为了方便用户的接入，我们提供了 Wordpress，Hugo ，Halo 等插件一键接入，相关文档可以在 https://docs.webp.se/webp-cloud/access/ 看到。

也同样是因为不需要切换 NS，我们提供了额外的保护措施防止你的源站图片被盗用，比如我们提供了自定义回源 UA，CORS Header ，以及 Referer 限制，这一点是上文中所对比的其他 CDN 所没有的。

此外和其他 CDN 一样，我们也支持 Custom Domain，意味着你可以使用自己的域名来输出图片，比如我们的两个用户（Keshane’s Simple Blog 和 STRRL’s backyard 就分别在使用自己的域名 https://webp.keshane.moe 和 https://webp.strrl.dev 来接入 WebP Cloud。

小结

从上文中可以看到，一旦涉及到 SaaS 和类似 CDN 的功能，那我们就涉足了一个非常卷的行业，几乎一旦涉及到图片处理，就人均有翻转，调亮度饱和度的功能，且和其他产品对比，我们在网络覆盖上的差异就很快被凸显出来，毕竟我们目前只在欧洲有节点，所以在一点上我们只能和其他厂家进行差异化竞争，除了实现大部分 CDN 都有的功能以外，我们的特色在于：

• 有持久化缓存，意味着可以极大减少你的源站压力
• 有额外的回源设置，保护你的源站图片不会被 CDN 穿透（绕过）
• 我们提供了水印和滤镜功能，可以方便批量给图片上水印或者滤镜
• 提供开源的 WebP Server Go，如果你想自己 Host 你的产品，那么你完全可以不用我们的 WebP Cloud 服务
• Telegram 群（https://t.me/webp_se）跨时区（UTC +2 和 UTC +8）响应，由于我们规模不大，所以每个付费用户都是我们忠实的支持者，可以和我们团队随时沟通
• 不融资，且没有盈利压力，所以我们会坚持做我们认为正确的事情，并探索各个有趣的方向（你知道嘛？我们服务全部在 ARM64 的机器上），不会被投资人等来对我们的方向指手画脚

如果你觉得我们的服务有意思，欢迎登录 WebP Cloud Dashboard 来体验，如果你好奇它还有哪些神奇的功能，可以来看看我们的文档 WebP Cloud Services Docs，希望大家玩的开心~