之前处理图片的方式是,小图标通过gulp配置的spritesmith雪碧图方式,.png会先用ps工具转成.jpg,然后jpg太大则用在线压缩工具来进行压缩(另外gulp系列的gulp-imagemin也用作压缩图片)。
今天看到了一个新的方式,图片为webp格式。以前也有见过但从来没用过这种格式,搜了一下,相信文档说的能大大减少带宽。
什么是WebP格式的图片?
WebP是Google在2010年发布的一种新型图片格式,支持无损和有损压缩。在无损压缩方面,同质量的WebP图片比PNG的体积小26%,而在有损压缩方面,同质量的WebP图片比JPEG小25-34%。WebP在不降低图片质量的同时,减少了约三分之一的体积。
以下介绍WebP安装使用
安装 (用于处理图片) 对应插件安装教程blog
智图API接口已被封装为gulp插件,智图for gulp 。 照github上的教程安装该插件使用
使用
WebP使用方式 (方案中包含PC、触屏、ios、安卓各版以及兼容版 方案)