WebP Cloud Services Blog

WebP Cloud 和 Cloudflare Polish 对比

· Nova Kwok

为了让页面上的图片体积更小,加载更快,各个厂商都有自己不同的做法,本文将对比 WebP Cloud 与 Cloudflare Polish,从「缓存特性」,「使用便捷度」,「价格」以及「支持特性」上进行对比。

介绍

WebP Cloud

WebP Cloud 专为图片处理而生,WebP Cloud 会将原始图片压缩为 WebP/AVIF 等格式大幅缩小原始图片体积以提升图片加载速度,同时删除图片元信息以减少隐私泄漏的可能,此外 WebP Cloud 还支持水印,图片缩放,获取图片 Metadata 等功能可以完整接管一个图片在网站上各处展示的需求。

WebP Cloud 的服务依托欧洲服务商 Hetzner,让我们可以提供对比同类产品而言性价比更高的服务,且数据存放在德国符合欧盟数据处理法规。

Cloudflare Polish

Cloudflare Polish 是一款一键图像优化产品,可以自动优化您网站上的图像。Polish 会去除图像的元数据,并通过有损或无损压缩来减小图像大小,从而加快图像下载速度。

当图像从您的源站获取时,我们的系统会自动在 Cloudflare 的缓存中优化它。后续对同一图像的请求将获得更小、更快、优化后的版本,从而提升您网站的速度。

来源:https://developers.cloudflare.com/images/polish/

价格

WebP Cloud

WebP Cloud 完全按照使用量来计费,截止本文写作时,WebP Cloud 的定价如下:

Always FreeLitePlusCustom Plan
Free3 USD/mo10 USD/moCustom
👏 Scale
Cache200 MiB / proxy1024 MiB / proxy4096 MiB / proxyCustom
BandwidthUnlimitedUnlimitedUnlimitedUnlimited
Daily request quota *3,0008,00030,000Custom
Proxies per user3610Unlimited

Cloudflare Polish

Cloudflare Polish 并不是一个单独的产品,如果你购买了 Cloudflare Pro Plan(25USD每月),便可以获得这个功能,且没有额外的收费。

缓存特性

WebP Cloud

WebP Cloud 给每个不同 Plan 的用户提供了不同的缓存空间,用户的图片请求会在第一次成功访问后被 WebP Cloud 的系统缓存(在 Proxy 所在的区域),在缓存没有满的情况下,后续所有到同 URL 的请求都会从缓存输出,不再会有任何回源请求到你的源站地址,不会对源站地址有任何额外的流量开销。

Cloudflare Polish

Cloudflare Polish 作为基于 Cloudflare 的产品,和 Cloudflare CDN 一样共享缓存规则,即:

当缓存想要存储一个新对象但没有空间时,它会使用一种称为最近最少使用(LRU)的算法来提名一个对象进行驱逐,并用新对象替换它。对象的缓存保留期是指对象在被驱逐前存储在 Cloudflare 缓存中的时间。值得注意的是,对象的保留期取决于其相对受欢迎程度和 Cloudflare 缓存的大小,因此不可配置。

来源:https://developers.cloudflare.com/cache/concepts/retention-vs-freshness

此外,Cloudflare 的缓存是每个数据中心(Datacenter)独立的,Cloudflare 的数据中心列表可以在 https://www.cloudflare.com/network/ 看到,例如,当你在访问这个 URL 时,从请求的 Header 中可以看到类似如下的:

cf-ray 8e4xxxxxxxx4ce6f-SIN

这里 SIN 是指 Cloudflare 的新加坡数据中心,意味着你的请求由这个数据中心响应。

当一张图片被某个数据中心缓存(并且没有被清理)的时候,后续访问到该数据中心的访客都会通过这个数据中心的缓存输出,但是如果缓存被清理,或者访客命中了非这个数据中心的话,Cloudflare 会再次访问你的源站拉取原图并渲染给用户,造成额外的响应时间和流量开销。

转换特性

WebP Cloud

WebP Cloud 会在第一次请求的时候从源站拉取原图并转换成 WebP ,并在判断访客浏览器支持情况下输出原图和 WebP 格式图片中体积最小且浏览器支持的格式的图片。

由于 AVIF 转换非常消耗系统资源,但 AVIF 往往有着比 WebP 更好的压缩效率,此时我们系统会在后台继续尝试将原图转换为 AVIF 格式的图片,并在转换完成后,在后续访客访问时选择 原图/WebP/AVIF 中体积最小,且访客浏览器支持的格式图片进行输出。

想了解更多关于我们对于 AVIF 图片的处理,可以参考 「WebP Cloud Services 目前已支持 AVIF」 一文。

Cloudflare Polish

在我们使用 Cloudflare Polish 的过程中,我们发现 Polish 有如下文档中没有写明的限制:

  1. 必须是 .jpg 或者 .png 结尾的 GET 请求,不能为 POST 请求,也不能为 ?url=xxxxx.jpg 格式的请求,这些请求均不会被 Polish 处理。
  2. 图片并不是在第一次请求时被转换,例如对于某张图片的多次请求返回的 Header 如下:

第一次请求,直接返回了原图, cf-cache-status: MISS

HTTP/2 200 
content-type: image/png
content-length: 967609
etag: W/"ec3b9-1930a2c9c6b"
cf-cache-status: MISS
cf-ray: xxxxxxxxxxxxxxxx-SIN

第二次请求,依然是原图, cf-cache-status: EXPIRED

HTTP/2 200 
content-type: image/png
content-length: 967609
etag: W/"ec3b9-1930a2c9c6b"
cf-cache-status: EXPIRED
cf-ray: xxxxxxxxxxxxxxxx-SIN

第三次请求,返回了优化后的 WebP 图片

HTTP/2 200 
content-type: image/webp
content-length: 574634
cf-bgj: imgq:85,h2pri
cf-polished: origFmt=png, origSize=967609
content-disposition: inline; filename="image--1-.webp"
vary: Accept
etag: W/"ec3b9-1930a2c9c6b"
cf-cache-status: HIT
age: 12
accept-ranges: bytes
cf-ray: xxxxxxxxxxxxxxxx-SIN

在这个测试中,从第三次请求开始 Cloudflare Polish 才返回了经过优化的 WebP 图片。

使用便捷度

WebP Cloud

和 Polish 不同,WebP Cloud 的使用需要在 Dashboard 中添加你的源站地址后通过 WebP Cloud 分配给你的新地址使用,例如你的源站地址是 https://image-storage.your-domain.tld,在创建 Proxy 后我们会给你分配一个 https://abc123.webp.li (如果在美国区)的地址,若原始图片在 https://image-storage.your-domain.tld/image.png,那么可以通过 https://abc123.webp.li/image.png 访问到优化后的图片。

由于使用了一个新的地址,这里便需要一些额外的操作来让你的站点上使用新地址来输出图片,我们的文档中有专门的「Access」 页面针对不同的网站给出建议。

Cloudflare Polish

如果你的域名已经被托管在 Cloudflare 上了,那么Polish 的开启非常方便,只需要在 Dashboard 上开启即可:

在开启后,如果你的图片链接为 .jpg 之类的结尾,便会在多次请求中的某一次获得优化后的图片了。

当然,如果你的域名并没有使用 Cloudflare 作为 CDN,使用 Polish 的前置条件便是要将域名添加到 Cloudflare 网络中,涉及到 NS 的变更和潜在的服务 Downtime。

总结

我们来总结一下 WebP Cloud 和 Cloudflare Polish 的使用差异。

从价格上来说,如果你的图片请求数量非常大的情况下,使用每个月固定价格的 Cloudflare Polish 可以获得更好的性价比,但是需要注意的是 Polish 并不能保证第一次请求便返回优化后的图片,尤其是考虑 Cloudflare 数据中心分散的问题,一个地区的访客访问到优化后的图片后并不能保证其余地区(由于缓存并不在不同数据中心之间共享),甚至同地区后续访客继续得到优化后的图片(由于缓存可能会过期),对比之下 WebP Cloud 提供稳定的缓存空间,并可以在第一次请求时便缓存优化后的图片用于后续任意次访问的缓存内输出,减少了后续回源带宽消耗和转换时间。

从使用便捷度来说,如果你的域名已经被托管在 Cloudflare 上了,Cloudflare Polish 使用起来非常简单,只要在 Dashboard 上开启即可(否则需要先进行修改 NS 等操作将域名添加到 Cloudflare 上才行),对于 WebP Cloud 而言,并不会有修改 NS 等操作,只需要做一些一次性的配置(即使使用自定义域名也仅仅是添加 CNAME 和 TXT 记录的事情)。

从功能上对比,Cloudflare Polish 仅能将 PNG/JPG 图片转换成 WebP 格式(可选 Lossy 或者 Lossless),而 WebP Cloud 支持将 PNG/JPG/HEIC/GIF 等格式的图片转换为 WebP/AVIF 等格式,且用户可以获得自定义转换质量,给图片加入水印,获得图片缩略图,获得图片 Meta 信息等一系列功能,尤其是对于希望在同一个地方存储图片,并将图片以不同格式用于不同位置的用户而言非常有利。


WebP Cloud Services 团队是一个来自上海和赫尔辛堡的三人小团队,由于我们不融资,且没有盈利压力 ,所以我们会坚持做我们认为正确的事情,力求在我们的资源和能力允许范围内尽量把事情做到最好, 同时也会在不影响对外提供的服务的情况下整更多的活,并在我们产品上实践各种新奇的东西。

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


Discuss on Hacker News