七夕节刚过去,小明却特别郁闷,因为七夕当天,他错过了和远在北京的女神表白的机会。事情的经过是怎样的呢?为了在七夕当天送给自己女神一件礼物,小明在某购物网站上花重金购买了特别的礼物,礼物是从广东发送,结果因为物流拥堵,七夕已经过去多天,女神却仍没收到礼物,小明因此错过了表白的时机。而二狗子相对来说就比较幸运了,在网上购买了一份礼物,也是送给远在北京的女神,不过礼物从北京分拣仓直接发出,女神在七夕当天收到了礼物并且接受了二狗子的表白。这个故事告诉我们有个贱贱的小名是多么重要,额……偏题了。

言归正传,下面来简单了解下 CDN。故事中分布在每个城市中的分拣仓库可以理解为 CDN 节点,用户在浏览网站的时候,CDN 会选择一个离用户近的 CDN 边缘节点来响应用户的请求,而不必请求到源站或者跨运营商请求,这样,CDN 节点解决了跨运营商和跨地域访问的问题,访问时间大大降低。同时,大部分请求在 CDN 边缘节点完成,CDN 起到了分流作用,减轻了源站的负载。

现如今,互联网用户的时间非常宝贵,拥有快速的数据传输能力,对于现在的网站、App 来说是必须的。一个良好的访问体验是用户不流失的基本条件,给网站、App 上CDN 无疑是明智之举。但随之而来的问题就是 CDN 的使用成本,虽然现在的 CDN 单价已经低到了尘埃,但是如果有更省钱的办法,甚至在省钱的同时,还能进一步提升用户体验,何乐而不为呢?

接下来就是激动人心的时刻了,我要开始曝光传说中的 CDN 省钱大法了。


妙招1. WebP 自适应

开启路径:登陆又拍云控制台 ⇒服务管理⇒ 配置 ⇒ 成本控制 ⇒ WebP自适应

WebP 主要功能是使图片质量和 JPEG 格式质量相同的情况下,减少图片文件的体积,籍此减少互联网上图片的发送时间和流量消耗。与其他图片格式相比,WebP 集合了多种图片文件格式的特点:像 JPEG 一样适合压缩照片和其他细节丰富的图片,像 GIF 一样可以显示动态图片,像 PNG 一样支持透明图像。

根据 Google 的测试,WebP 无损压缩图片比 PNG 图片少了 45% 的文件体积,即使这些 PNG 图片在使用 pngcrush 和 PNGOUT 处理后,WebP 依旧可以减少 28% 的文件体积。

1.png

△ 2017 年,某图片网站应用 WebP 前后的带宽/流量变化

从上图的数据可以看出,通过对新一代图片格式 WebP 的应用,该图片网站在总体请求量变化不大的情况下,整体带宽、流量近下降了 50%,成功降低网站带宽资源的消耗,节省了一大笔成本。

妙招 2. H.265 自适应

开启路径:登陆又拍云控制台 ⇒ 服务管理 ⇒ 配置 ⇒ 成本控制 ⇒ H.265自适应

H.265 是在 H.264 的基础上保留其中的部分技术,并对相关技术加以改进研发而成。相较与 H.264,H.265 视频压缩率更出众,效率提升近 1 倍,仅需原先的一半带宽即可播放相同质量的视频。

众所周知,视频编码的码率是可以灵活控制的,以相同的视频质量为基准,H.265 编码技术相比 H.264 编码技术能够在视频容量减少 39% 到 74%,并且还能获得比 H.264 视频更好的信噪比(PSNR)效果。——拿“体积比你小,质量比你好”来形容 H.265 相比 H.264 的巨大优势,并没有显得过分。

2.png

△ H.264、H.265 压缩率对比


视频传输流量节省 50%,IEEE 出版的 Circuits and Systems for Video Technology,其中有 Comparison of the Coding Efficiency of Video Coding Standards—Including High Efficiency Video Coding 一文,以 9 段影片进行测试 H.265 的编码表现,所得到的结果相当另人满意,即便在表现最差的样本中,节省的流量接近 30%,平均起来也达到 49.3% 的佳绩。

3.png

△ H.265 与 H.264 流量比较(资料来源:IEEE)

秒招3. 智能压缩

开启路径:登陆又拍云控制台 ⇒ 服务管理 ⇒ 配置 ⇒ 性能优化 ⇒ 智能压缩

智能压缩支持 Gzip 和 Brotli 压缩算法。开启该功能,可对静态文件类型进行压缩,有效减少用户传输内容大小,加速分发效果。为了配置的灵活性,智能压缩功能支持压缩等级(1 到 5)的设置。

Gzip 基于 DEFLATE 算法,它是 LZ77 和霍夫曼编码的组合,最初用于 UNIX 系统的文件压缩。HTTP 协议上的 Gzip 编码是一种用来进 Web 应用程序性能的技术,Web 服务器和客户端(浏览器)必须共同支持 Gzip,当下主流的浏览器都是支持 Gzip 压缩,包括 IE6、IE7、IE8、IE9、FireFox、Google Chrome、Opera 等。

Brotli 压缩算法是Google 在 2015 年 9 月推出了无损压缩算法 Brotli。Brotli 通过变种的 LZ77 算法、Huffman 编码以及二阶文本建模等方式进行数据压缩,与其他压缩算法相比,它有着更高的压缩效率。

开启之前 VS 开启之后

4.png

△ 未开启前:将 Gzip 和 Brotli 特性关闭

5.png

△ 开启后:将 Gzip 和 Brotli 同时开启,压缩等级设置为 5

同时开启 Gzip 和 Brotli 压缩算法时,Brotli 压缩等级优先级高于 Gzip ,当客户端同时支持两种压缩算法的情况下,会优先返回 Brotli 版本的资源文件。上图中,同时开启了 Gzip 和 Brotli,但使用的压缩算法是 Brotli,压缩等级为 5。

节省带宽和流量,减少源站压力对于每个网站、App 来说都非常重要。而 WebP 自适应、H.265 自适应、智能压缩三个特性分别包含了对图片、视频、静态资源的优化,这几乎包含了一个网站、App 的所有元素。这三大妙招既节约了流量开支,又带给用户更好的使用体验,并且只要点下按钮就能自主开启,你还在等什么呢?