Safari 14.0 的功臣 Webp？

原创 于 2021-04-07 10:39:23 发布 · 484 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#webp

本文介绍了 WebP 图像格式的优势，包括其在压缩效果上的表现，以及如何在项目中使用 WebP。随着 Safari 14.0 的支持，WebP 已经被所有主流浏览器接纳，有望得到更广泛的应用。通过 WebP，开发者可以实现更小的图片体积，提高网页加载速度，提升用户体验。

俗话说：一图胜千言。在网上，图片虽然可以让用户更加简单明了地看到更多信息，但是图片体积也可以抵过上千字节甚至更多。研究表明，打开一个 HTTP 网页，其中图片平均占比为 64%。在图片占比如此高的情况下，用户对图片的体积就有非常高的要求了。

我们可以通过图片压缩的方式来缩小图片体积。但是要如何保证图片体积缩小的同时而不大幅降低图片质量呢？传统的图片格式，如 JPEG，PNG，GIF 等格式图片已经没有太多的优化空间，而 Google 于 2010 年推出 WebP 图像格式。WebP 图像在相同素质下，比 JPG 体积小 25-34％，比 PNG 则小 26％，并且，WebP 更可以做到动态 GIF 的部分功能，也支持透明化及失真，无失真压缩等模式。

市面上的浏览器，例如 Chrome，Firefox，Microsoft Edge 都已经支持 WebP，随着 iOS 14 以及 macOS Big Sur 的发布，在 WebP 发布的 11 年后，苹果终于跟进，Safari 开始支持 WebP。至此，主流浏览器均已正式支持 WebP 格式，相信今后 WebP 会获得更为广泛的部署和支持。

浏览器 WebP 支持情况

WebP 的由来

WebP 的诞生起初是因为 Google 开发了一种基于 VP8 视频编码格式的 WebM 视频格式，Google 的工程师意识到 WebM 格式非常适合压缩关键帧，由此开发了 WebP 图片格式。

WebP 主要目标是使图片质量和 JPEG 格式质量相同的情况下，减少图片文件的体积，从而减少互联网上图片的发送时间和流量消耗。发布不久之后，WebP 便被整合到 Chrome 以及 Android 系统中，并且 Google 发布了函数库，让 iOS 应用等其他平台支持 WebP 格式。

相较于 JPEG 只能提供有损压缩，WebP 同时提供有损压缩和无损压缩：

最低0.47元/天 解锁文章
博客
3 分钟了解 NVIDIA 新出的 H200
01-24 2053
英伟达在 2023 年全球超算大会上发布了备受瞩目的新一代 AI 芯片——H200 Tensor Core GPU。相较于上一代产品 H100，H200 在性能上实现了近一倍的提升，内存容量翻倍，带宽也显著增加……
博客
深入了解浮点运算——CPU 和 GPU 算力是如何计算的
01-17 4671
算力最基本的计量单位是 FLOPS，英文 Floating-point Operations Per Second，即每秒执行的浮点运算次数。浮点运算其实就是带小数的加减乘除运算。
博客
加速计算，为何会成为 AI 时代的计算力“新宠”
12-25 914
加速计算是指使用专用硬件来执行某些类型的计算，其效率要比仅使用通用中央处理器（CPU）高。利用图形处理单元（GPU）、专用集成电路（ASIC）（包括张量处理单元（TPU））和现场可编程逻辑门阵列（FPGA）等设备的强大功能，以更高的速度执行计算，从而加速计算过程，一般我们也将这些设备称之为加速器。这些加速器尤其适用于可被分解为较小并行任务的项目，如高性能计算 (HPC)、深度学习、机器学习、人工智能和大数据分析。通过将指定类型的工作分派到这些专用加速计算硬件上，大大提高了系统的性能和效率。
博客
NVIDIA RTX4090，你能用它做什么？
12-12 2151
如果女生选择给男生送礼，我相信一块 RTX4090 就足以让他高兴得死去活来。RTX4090 到底是何方神圣？它凭什么赢得所有男生的“芳心”？
博客
3 分钟看完 NVIDIA GPU 架构及演进
11-10 1839
近期随着 AI 市场的爆发式增长，作为 AI 背后技术的核心之一 GPU（图形处理器）的价格也水涨船高。GPU 在人工智能中发挥着巨大的重要，特别是在计算和数据处理方面。目前生产 GPU 主流厂商其实并不多，主要就是 NVIDIA、AMD、Intel、高通等厂家。本文将主要聊聊 NVIDIA GPU 的核心架构及架构演进。
博客
聊聊 GPU 产品选型那些事
11-09 900
随着人工智能的飞速崛起，随之而来的是算力需求的指数级增加，CPU 已经不足以满足深度学习、大模型计算等场景的海量数据处理需求。GPU 作为一种强大的计算工具，无论是高性能计算、图形渲染还是机器学习领域，在各个领域展现出了巨大的潜力和应用前景。说起 GPU，绕不过的当然是 NVIDIA 这个公司了，现在市面上火热的 A100/A800、H100 等 GPU 全是他家的产品。但当你有业务需求或者个人需求，想要采购 GPU 的时候，你会发现各个型号的 GPU 令你眼花缭乱。
博客
巅峰对决：英伟达 V100、A100/800、H100/800 GPU 对比
11-08 1万+
近期，不论是国外的 ChatGPT，还是国内诸多的大模型，让 AIGC 的市场一片爆火。而在 AIGC 的种种智能表现背后，均来自于堪称天文数字的算力支持。以 ChatGPT 为例，据微软高管透露，为 ChatGPT 提供算力支持的 AI 超级计算机，是微软在 2019 年投资 10 亿美元建造一台大型顶尖超级计算机，配备了数万个 NVIDIA A100 GPU，还配备了 60 多个数据中心总共部署了几十万个 NVIDIA GPU 辅助。
博客
InfiniBand 的前世今生
11-03 783
今年，以 ChatGPT 为代表的 AI 大模型强势崛起，而 ChatGPT 所使用的网络，正是 InfiniBand，这也让 InfiniBand 大火了起来。那么，到底什么是 InfiniBand 呢？下面，我们就来带你深入了解 InfiniBand。
博客
揭秘神秘的字符串匹配工具——正则表达式
10-31 328
每个正则表达式都有一个有限自动机（也称为状态机），它接受表达式指定的语言，并使用 Thompson 构造算法将正则表达式转化为一个与之等价的非确定有限状态自动机（NFA）。同时，对于每个有限自动机来说，还有一个描述该自动机所接受语言的正则表达式。该表达式可以通过克莱恩算法或高斯消元法生成。正则表达式的一个著名应用是文本编辑器中的搜索和替换功能，计算机先驱 Ken Thompson（ UNIX 操作系统的开发者之一）首先在 20 世纪 60 年代的面向行编辑器 QED 中实现了该功能。
博客
深入了解 GPU 互联技术——NVLINK
10-09 3582
随着人工智能和图形处理需求的不断增长，多 GPU 并行计算已成为一种趋势。对于多 GPU 系统而言，一个关键的挑战是如何实现 GPU 之间的高速数据传输和协同工作。然而，传统的 PCIe 总线由于带宽限制和延迟问题，已无法满足 GPU 之间通信的需求。为了解决这个问题，NVIDIA 于 2018 年推出了 NVLINK，以提高 GPU 之间的通信效率。
博客
各快 100 倍？4G、5G、6G 相差这么多吗
09-18 394
二狗子今天晚上有点 emo，为什么呢？原来是二狗子心心念很久的一个手游上线了，二狗子兴冲冲地下载了 40 多分钟，终于下载完了游戏。结果打开游戏一看，发现游戏内部的更新写着预计 30 分钟完成更新。这就把二狗子搞得 emo 了。二狗子突然发现自己的室友已经在这款游戏的新手村大杀四方了。“你怎么这么快？”二狗子问。“我用手机流量下载的，5G，当然快。”室友都没看二狗子一眼，沉浸在自己的游戏世界里。5G 真的有这么快吗？好学的二狗子就让游戏保持着后台更新，在网上冲浪学习下知识充实自己。
博客
为什么大家都在用 WebP？
09-13 823
WebP 是谷歌在 2010 年提出的一种新型的图片格式，放到现在来讲，已经不算是“新”技术了，毕竟已经有了更新的 JPEG XL 和 AVIF。但是在日常工作中，大家时常会碰到保存下来的图片的后缀是 .webp。那么 WebP 到底有什么魔力，让越来越多的网站“抛弃”常用的 PNG、JPG 而青睐它呢？
博客
从驾考科目二到自动驾驶，聊聊 GPU 为什么对自动驾驶很重要
09-07 298
这些数据包含前车和本车的距离，左右两边的道路指示标志，周围汽车的距离，前方道路指示标志，红绿灯信号，马路边行人，非机动车等信息等，大量的图像和视频信息被转换成电脑能处理的二进制信息，这就需要 CPU 和 GPU 的共同加持才能完成安全稳定的自动驾驶工作。
博客
聊透 GPU 通信技术——GPU Direct、NVLink、RDMA
09-05 2380
AI 技术对算力的需求是非常庞大的，虽然 GPU 的计算能力在持续提升，但是对于 AI 来说，单卡的计算能力就算再强，也是有极限的，这就需要多 GPU 组合。而 GPU 多卡的组合，主要分为单个服务器多张 GPU 卡和多个服务器，每个服务器多张卡这两种情况，无论是单机多卡还是多机多卡，GPU 之间需要有超强的通信支持。
博客
这个 AI 机器人会怼人，它是怎么做到的？
09-01 653
人工智能可以定义为计算机科学的一个分支，其目标是创造与人类智力相当的技术。但智力到底是什么？如何利用技术来复制智力？这个疑问并不存在单一的理解，目前已经有了许多理论和方法来回答这些问题。人工智能的实现方式主要有两种：一种是基于规则的人工智能，通过预先编写的规则和逻辑来实现特定的任务；另一种是基于机器学习的人工智能，通过让计算机从数据中学习和优化算法，来实现特定的任务。
博客
如何评估计算机的算力：从 CPU 到 GPU 的演变
08-25 2232
这就是 CPU 和 GPU 在计算能力上的区别，这是由它们的架构决定的，CPU 可以执行任何程序，而 GPU转为多任务而生，并发能力强。当然，上面的两张图并不是说 GPU 比 CPU 厉害，事实上，CPU 和 GPU 各自具有不同的特点和优势，选择哪种设备取决于具体的应用场景和需求。其中，CPU（中央处理器）和 GPU（图形处理器）是计算机中最为核心的两个组件，它们的算力和性能对于计算机的整体性能具有决定性的影响。CPU 是计算机的核心组件之一，它的主要功能是执行指令、控制计算机的运行和处理数据等任务。
博客
浅谈 Linux 下 vim 的使用
08-24 1284
底线模式的进入方法为：在命令模式下按":“键，Vim 窗口的左下方会出现一个”:"符号，这时就可以输入相关的指令进行操作了。在此模式下可以使用上、下、左、右键或者k、j、h、l键进行光标的移动，还可以对文件内容进行复制、粘贴、替换、删除等操作。当编辑完成，就可以按 Esc 退出插入模式，进入到命令模式。p : 黏贴，此命令是在命令模式下，按照上面的命令复制后，然后光标移动到想要复制的位置，然后按 p 黏贴。直接到某行：在底线模式下直接输入数字就可以到想到的行，如果输入的数字比文档的行数多就会到最后一行。
博客
如何高效实现 MySQL 与 elasticsearch 的数据同步
03-15 684
MySQL 自身简单、高效、可靠，是又拍云内部使用最广泛的数据库。但是当数据量达到一定程度的时候，对整个 MySQL 的操作会变得非常迟缓。而公司内部 robin/logs 表的数据量已经达到 800w，后续又有全文检索的需求。这个需求直接在 MySQL 上实施是难以做到的。
博客
国密证书 VS 传统 SSL 证书，到底区别在哪？
03-10 1258
国密算法，即国家商用密码算法。是我国自主研发创新的一套数据加密处理系列算法。从 SM1-SM4 分别实现了对称、非对称、摘要等算法功能。尤其适用于嵌入式物联网等相关领域，完成身份认证和数据加解密等功能。
博客
又拍云邵海杨 - 25年Linux老兵，聊聊运维的“术”与“道”
03-06 705
邵海杨，从1998年开始使用Linux至今快25年了，资深Linux系统运维/架构师，DevOps八荣八耻倡导者，喜欢交流分享，活跃于社区，一直积极投身于开源活动的组织和传播。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值