欢迎来到深圳市来科信科技有限公司网站!

已阅读

网站开发时使用webp格式图片的优势

来源:lexintech.com       发布时间:2017-10-12
WebP格式,谷歌(google)开发的一种旨在加快图片加载速度的图片格式。图片压缩体积大约只有JPEG的2/3,并能节省大量的服务器带宽资源和数据空间。Facebook、Ebay等知名网站已经开始测试并使用WebP格式。
网站开发中使用webp格式 图片
WebP 在各大互联网公司已经使用得很多了,国外的有 Google(自家的东西必须要支持的啦)、Facebook 和 ebay,国内的有淘宝、腾讯和美团等。
 
webp优势:
更小的图片体积
更优的图像数据压缩算法
无损和有损的压缩模式
肉眼识别无差异的图像质量
Alpha透明以及动画的特性
 
Webp探究:
WebP 的优势体现在它具有更优的图像数据压缩算法,能带来更小的图片体积,而且拥有肉眼识别无差异的图像质量;同时具备了无损和有损的压缩模式、Alpha 透明以及动画的特性,在 JPEG 和 PNG 上的转化效果都相当优秀、稳定和统一。
 
之前做过一个测试,对比 PNG 原图、PNG 无损压缩、PNG 转 WebP(无损)、PNG 转 WebP(有损)的压缩效果:
网站开发时使用webp格式图片
可以得出结论:
 
PNG 转 WebP 的压缩率要高于 PNG 原图压缩率,同样支持有损与无损压缩
转换后的 WebP 体积大幅减少,图片质量也得到保障(同时肉眼几乎无法看出差异)
转换后的 WebP 支持 Alpha 透明和 24-bit 颜色数,不存在 PNG8 色彩不够丰富和在浏览器中可能会出现毛边的问题
经测试,JPEG 转 WebP 的效果更佳。13 年底 Google 正式推出 Animated WebP,即动态 WebP,既支持 GIF 转 WebP,同时也支持将多张 WebP 图片生成 Animated WebP。但是压缩效果未能达到宣传的那样。
 
科技博客 GigaOM 曾报道:YouTube 的视频略缩图采用 WebP 格式后,网页加载速度提升了 10%;谷歌的 Chrome 网上应用商店采用 WebP 格式图片后,每天可以节省几 TB 的带宽,页面平均加载时间大约减少 1/3;Google+ 移动应用采用 WebP 图片格式后,每天节省了 50TB 数据存储空间。
 
WebP 的应用场景及优势:
客户端软件,内嵌了基于 Chromium 的 webview,这类浏览器中应用的网页是可以完全使用WebP 格式,提升加载渲染速度,不考虑兼容
用 node-webkit 开发的程序,用 WebP 可以减少文件包的体积
移动应用 或 网页游戏 ,界面需要大量图片,可以嵌入 WebP 的解码包,能够节省用户流量,提升访问速度优势
对于 PNG 图片,WebP 比 PNG 小了45%。
APP开发 网站开发 产品设计 微信公众号 APP开发公司 用户体验 APP运营 微信小程序 产品经理 网站设计