都说 WebP 厉害,究竟厉害在哪里?
之前在《 WebP 的前世今生 》一文中,介绍了 WebP 图片格式是由 Google 基于 VP8 视频编码格式研发的,同时提供有损压缩和无损压缩两种格式,那么今天就来看看 WebP 有损压缩与无损压缩的具体技术细节。
WebP 有损压缩
WebP 有损压缩使用的图像编码方式与 VP8 视频编解码器 WebM 格式压缩视频关键帧的方法相同,WebP 格式的图片本质就是 WebM 文件中被压缩的帧。
进行有损压缩时,WebP 会将图片划分为两个 8x8 色度像素宏块和一个 16x16 亮度像素宏块。在每个宏块内,编码器基于之前处理的宏块来预测冗余动作和颜色信息。通过图像关键帧运算,使用宏块中已解码的像素来绘制图像中未知部分,从而去除冗余数据,实现更高效的压缩。
WebP 编码器四种帧内预测模式:
H_PRED(水平预测):用宏块左边的列 L 的填充块的每一列;
V_PRED(垂直预测):用宏块上边的行 A 的填充宏块的每一行;
DC_PRED(DC预测):用行 A 和列 L 的像素的平均值作为宏块唯一的值来填充宏块;
TM_PRED(TrueMotion预测):除了行 A 和列 L 之外,用宏块上方和左侧的像素P、A(从P开始)中像素块之间的水平差异以列
为基准拓展每一行。
△ WebP 有损压缩预测模式
当图片处理到此处时,还剩下小的残差,通过 FDCT (正向离散余弦变换),让变换后的数据低频部分分布在数据块左上方,而高频部分集中于右下方实现更高效的压缩。
最后是将结果量化并进行熵编码。WebP 使用的是布尔算术编码作为熵编码方式,直接把输入的消息编码为一个满足(0.0 ≤ n < 1.0)的小数n。
△ WebP有损压缩所涉及的步骤
有损 WebP VS JPG
△ JPG vs 有损 WebP
当 WebP 将 JPG 压缩到相当于原图 90% 质量 时,图片体积减少了 50% 左右。当 WebP 将 JPG 压缩到相当于原图 80% 质量时,图片体积则减少了 60%~80%。
有损 WebP 压缩性能优于 JPG 的原因主要是其预测编码技术先进,并且宏块自适应量化也带来了压缩效率的提升,而布尔算术编码与霍夫曼编码相比提升了 5%~10% 的压缩性能。
WebP 无损压缩
WebP 无损压缩采用了预测变换、颜色变换、减去绿色变换、彩色缓存编码、LZ77 反向参考等不同技术来处理图像,之后对变换图像数据和参数进行熵编码。下文将对 WebP 的技术点进行一 一解析:
预测变换
预测空间变换通过利用相邻像素的数据相关性减少熵。在预测变换中,对已解码的像素预测当前像素值,并且仅对差值(实际预测)进行编码。预测变换有 13 种不同的模式,使用较多的是左、上、左上以及右上的像素预测模式,其余为左、上、左上和右上组合的平均值预测模式。
颜色变换
借助颜色变换去除每个像素的 R,G 和 B 值。彩色变换时保持绿色(G)值原样,根据绿色(G)值变换红色(R)值,再根据绿色值转换蓝色(B)值,最后根据红色(R)值进行转换。
如果与预测变换的情况一样,就需要将图像划分为宏块,并且对于宏块中的所有像素使用相同的变换模式。变换模式分为 3 种:green_to_red,green_to_blue和red_to_blue。
减去绿色变换
“减去绿色变换”从每个像素的红色、蓝色值中减去绿色值。当此变换存在时,解码器需要将绿色值添加到红色和蓝色。
彩色缓存编码
无损 WebP 压缩使用已经看到的图像片段来重构新的像素。如果没有找到对应的匹配值,可以使用本地调色板,同时本地调色板也会不断更新最近使用的颜色。
△ 更新本地色彩缓存
无损 WebP 对比 PNG
△ PNG 原图、PNG 无损、 WebP 无损对比(资料来源:http://isparta.github.io/comp...)
上图是 PNG 原图与 WebP 无损的对比,WebP 无损对 PNG 图片的优化到达了 20%~40% 。
WebP 与主流图片格式功能对比
△ 各图片格式功能对比
如何开启 WebP 图片格式
目前 WebP 图片格式依托于其优异的图片压缩性能以及兼备无损和有损两种压缩算法,在各大网站和 App 得到普及,那么要如何在网站中开启 WebP 格式呢?
△ 又拍云控制台 WebP 自适应开启方式
又拍云目前已经支持 WebP 图片格式转换,而且还支持 WebP 自适应功能,在后台一键开启 WebP 自适应功能,即可通过 CDN 平台智能判断客户端浏览器是否支持 WebP 解码,如果支持则返回 WebP格式图片,如果不支持则会返回原图,在客户端以及源站无需任何改动。
参考文章:
WebP—维基百科:https://zh.wikipedia.org/wiki...
A new image format for the Web:https://developers.google.com...
Compression Techniques:https://developers.google.com...
WebP的工作原理:http://www.jianshu.com/p/5558...
WebP原理和Android支持现状介绍:https://zhuanlan.zhihu.com/p/...
Common Image Formats:https://developer.akamai.com/...
都说 WebP 厉害,究竟厉害在哪里?相关推荐
- 想分享给各位的故事【如果你想成为很厉害很厉害的人】
第二次更新 想讲述一个故事,关于<如何成为很厉害很厉害的人>,作者是知乎著名大V---大师兄_朱炫, 文章获得了3万6千个赞,每次孤独受挫的时候我都会看2遍 如果你此时不能沉静下心来看,我 ...
- 从没钱营销到全球追捧,这个品牌究竟厉害在哪里?
关注时尚的朋友一定知道Jacquemus这个品牌,即使没有听过,也一定知道曾带动过全球巴掌大迷你潮流包包市场的法国新兴品牌吧. 很多时尚品牌,比如Louis Vuitton.Gucci.Burberr ...
- 原来小米手机这么好用,这4大功能,各个都是黑科技,厉害了
小米手机一直以性价比而广受用户喜爱,但还有一大部分人,是因为MIUI系统而喜欢使用小米手机的.小米MIUI系统的易用性在国产UI中算是数一数二的,并且MIUI的黑科技功能也有很多,尤其是这4大功能,各 ...
- python数据分析年薪百万_年薪百万的BI数据分析师究竟厉害在哪里?
前几天有一个截图被大家广泛传播,标题是"普适性职业生涯",内容如下: 虽然大家看完都会笑一笑,但是最后却不得不接受一个事实: 很多人在职场里,会随着年龄增长,变得越来越平庸,而不是 ...
- 生物信息 Python 库 - Dash Bio 究竟厉害在哪里?
翻译 | Lemonbit 来源 | Plotly 责编 | 胡巍巍 推荐一个牛逼的生物信息 Python 库 - Dash Bio Dash Bio 是一个免费的开源 Python 库,用于生物信息 ...
- 荣耀手环四有计算机功能吗,穿戴功能以及体验的全新升级,荣耀手环4究竟厉害在哪儿?...
如果你留意的话会发现这些天无论微博还是朋友圈都在热议一个话题--消费降级.所谓消费降级说白了就是年轻人消费理念得到了进一步升级,消费决定变得更加冷静实惠,希望用较低价格来获取更高生活品质,而这也同样体 ...
- Google 视频编码格式 VP9 究竟厉害在哪里
近期 Google 已经开始研究 VP10 了,VP10 是一个由 WebM 和 Motroska 包含的开放.免费视频编解码器.Google 也已利用 VP10 来处理 YouTube 4K 视频. ...
- 用国产芯片的神威太湖之光究竟厉害在哪?
6月19日,在德国法兰克福举行的全球超级计算大会公布新一期全球超级计算机500强榜单中,由国家并行计算机工程技术研究中心使用中国自主芯片研制的"神威·太湖之光"第三次出现在全球超算 ...
- 都2022年了 究竟什么叫旗舰手机?
仔细想想,大家对旗舰手机的定义好像一直都在变.2009年,能触摸的手机就是旗舰手机:2013年,支持4G的手机才算旗舰产品:2017年,有2K屏幕的才叫"真旗舰".那么到了2022 ...
最新文章
- Yann Lecun纽约大学《深度学习》2020课程笔记中文版,干货满满!
- 在DataGridView中添加行号
- C++ Primer Plus学习:第十章
- 软件版权的双重许可是什么
- 双表联查mysql_MySQL的双表多表联查
- javascript中数据访问性能优化简析
- SwiftUI AsyncImage cancelled 无法加载图片
- virtualbox 中,虚拟机网络使用NAT方式时,其它机器对虚拟机的访问
- 直播视频网站源码,延迟的几种方式
- c语言实现文件名随时间变化,WizTree 最好用的磁盘文件分析工具
- SPSS——描述性统计分析——探索性分析
- 小议中国人的乡土情结
- sina邮箱的发件服务器拒绝,向新浪sina邮箱发信常见退信说明
- 刍议当代大学生恋爱观
- Windows 无法打开“添加打印机”。本地打印后台处理程序服务没有运行。请重新启动打印机后台处理程序或重新启动计算机。...
- 面试题01.05.一次编辑
- 量子计算数学基础,pauli 矩阵
- 逆向破解_iOS_学习笔记_1
- 用Mouse_event()来模拟鼠标操作
- 解决uni-uploadFile上传图片丢失后缀名的问题
热门文章
- SAP 如何得到交货单上的序列号清单?
- 吴恩达深度学习笔记(67)-迁移学习(Transfer learning)
- dgl库之高级用法dgl.DGLGraph.update_all
- 强化学习之gym初战实战案例:悬崖案例CliffWalking-v0。
- 最早的神经元从何而来?海绵基因图谱揭示神经系统起源
- Curr Biol:间隔学习可巩固记忆的奥秘
- 中国世界工厂地位为什么不会动摇
- AI+视频分析:实时监测无处不在的安全风险
- Nature突破:首个比头发丝还细的机器人诞生了!可用针头注射入人体
- 窥探当今AI芯片中的类脑模型