之前处理图片的方式是,小图标通过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、安卓各版以及兼容版 方案)

图片在线处理 webp!的更多相关文章

  1. 网站图片无缝兼容 WebP/AVIF

    前言 WebP 格式发布已有十余年,但不少站点至今仍未使用,只为兼顾极少数低版本浏览器.至于去年发布的 AVIF 格式,使用的站点就更少了. 然而图片往往是流量大户,与其费尽心机优化脚本体积,可能还不 ...

  2. asp.net实现图片在线上传并在线裁剪

    1.说明 接上一篇文章uploadify实现多附件上传完成后,又突然用到头像上传并在线裁剪.在网上找个众多例子都没有符合要求的,有一篇文章写的不错,就是文旺老兄写的这篇Asp.Net平台下的图片在线裁 ...

  3. jpg、png格式的图片转换成webp后颜色失真的问题

    今天简单的试用了一下 cweb.exe 将 jpg, png 格式的图片转换成 webp 格式. 我今天下载的是当前最新版:1.0.0 cwebp 3.jpg  -q 85 -o 3.webp 发现图 ...

  4. Base64图片编码原理,base64图片工具介绍,图片在线转换Base64

    Base64图片编码原理,base64图片工具介绍,图片在线转换Base64 DataURI 允许在HTML文档中嵌入小文件,可以使用 img 标签或 CSS 嵌入转换后的 Base64 编码,减少  ...

  5. jsp版ueditor图片在线管理返回绝对路径

    引用:http://zhengyunfei.iteye.com/blog/2149979 如果你有富文本编辑器的功能需要开发,我推荐你用百度的ueditor.本文将与你分享jsp版ueditor开发中 ...

  6. centos下 将(jgp、png)图片转换成webp格式

    由于项目要求需要将jpg.png类型的图片  转换成webp格式,最开始使用了php gd类库里 imagewebp 方法实现,结果发现转换成的webp格式文件会偶尔出现空白内容的情况.像创建了一个透 ...

  7. C#设计模式总结 C#设计模式(22)——访问者模式(Vistor Pattern) C#设计模式总结 .NET Core launch.json 简介 利用Bootstrap Paginator插件和knockout.js完成分页功能 图片在线裁剪和图片上传总结 循序渐进学.Net Core Web Api开发系列【2】:利用Swagger调试WebApi

    C#设计模式总结 一. 设计原则 使用设计模式的根本原因是适应变化,提高代码复用率,使软件更具有可维护性和可扩展性.并且,在进行设计的时候,也需要遵循以下几个原则:单一职责原则.开放封闭原则.里氏代替 ...

  8. html5上传本地图片,在线预览及裁剪(filereader,canvas)

    1 我们常常需要上传头像,点击上传按钮时候需要预览一下,使用filereader方法无需和后台交互,代码如下: //本地图片在上传之前的预览效果 //图片上传预览 function previewIm ...

  9. python 图片在线转字符画预览

    文章链接:https://mp.weixin.qq.com/s/yiFOmljhyalE8ssAgwo6Jw 关于python图片转字符画,相信大家都不陌生,经常出现在 n个超有趣的python项目中 ...

随机推荐

  1. elixir mac环境

    1.升级brew brew update 2.安装 erlang brew install erlang 3.安装Elixir: brew install elixir 终端 iex iex> ...

  2. C#+SharpMap的相关代码

    //放大的代码: private void MapZoomIn(NameValueCollection queryString) { SharpMap.Map map = Session[" ...

  3. fuzz系列之afl

    afl 实战 前言 像 libFuzzer, afl 这类 fuzz 对于 从文件 或者 标准输入 获取输入的程序都能进行很好的 fuzz, 但是对于基于网络的程序来说就不是那么方便了. 这篇文章介绍 ...

  4. oracle 和 mysql 和区别

    1.mysql 有枚举类型,oracle 没有; mysql不支持number.varchar2类型,报错.2.oracle 支持全外连接,mysql 不支持 select e.ename, e.sa ...

  5. gitlab在centos7和ubuntu16 上的安装

    虽然之前也了解了一些开源的git代码服务器,后来也认同了gitlab的优越性,也认识到了gitlab的普及性,自己也是在网上查了一些资料,很多资料都是分应用安装,例如安装redis nginx rub ...

  6. 如何使用 Jenkins、GitHub 和 Docker 在 Azure 中的 Linux VM 上创建开发基础结构

    若要将应用程序开发的生成和测试阶段自动化,可以使用持续集成和部署 (CI/CD) 管道. 本教程介绍如何在 Azure VM 上创建 CI/CD 管道,包括如何: 创建 Jenkins VM 安装并配 ...

  7. OtterTune来了,DBA怎么办

    https://blog.csdn.net/xiangzhihong8/article/details/72887476 最近AI的新闻特别多,席卷了围棋圈之后,成为了技术圈和媒体热捧的话题. 今天又 ...

  8. CentOS针对磁盘IO[jdb2进程]的优化

    CentOS的jdb2进程总是沾满io,查了一些资料后才知道,这个问题源自系统bug,在此记录一下解决办法: 将高IO的磁盘,用以下参数remount即可 mount -t ext4 -o remou ...

  9. Skype for Business Server 2015 企业语音部署和配置

    Skype for Business Server 2015包含的企业语音功能可实现更丰富的通信和协作.例如,可以将企业语音部署配置为启用Skype for Business Server 2015客 ...

  10. Win7如何设置多用户同时远程登录

    有时候服务器是Win7系统的时候,远程登录桌面时,即使登录的是不同的管理账号,还是会把远程登录的人给记下来.即不同的账号只能同时存在一个会话窗.本文教大家如果设置Win7让两个账号的两会话同时存在,且 ...