首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么Google Chrome加载的是JPG而不是Avif和WebP?

Google Chrome加载的是JPG而不是Avif和WebP的原因是因为JPG是一种广泛支持的图像格式,几乎所有的浏览器和操作系统都能够很好地解析和显示JPG图像。而Avif和WebP是相对较新的图像格式,虽然它们在图像压缩方面具有更好的性能和更小的文件大小,但是目前并不是所有的浏览器和操作系统都支持这两种格式。

JPG(Joint Photographic Experts Group)是一种基于有损压缩的图像格式,适用于存储照片和复杂图像。它具有广泛的兼容性,几乎所有的浏览器和操作系统都能够原生地支持JPG图像的解析和显示。JPG图像在保持较高质量的同时,能够实现相对较小的文件大小,这使得它在网络传输和存储方面具有优势。

Avif(AV1 Image File Format)和WebP是两种新兴的图像格式,它们都采用了先进的压缩算法,能够在保持较高质量的同时实现更小的文件大小。Avif是基于AV1编解码器的图像格式,而WebP是由Google开发的一种支持有损和无损压缩的图像格式。这两种格式相对于JPG来说,在相同质量下能够实现更小的文件大小,从而提高了网页加载速度和用户体验。

然而,尽管Avif和WebP在图像压缩方面具有优势,但目前并不是所有的浏览器和操作系统都原生地支持这两种格式。这意味着如果网页中使用了Avif或WebP格式的图像,那些不支持这些格式的浏览器和操作系统将无法正确解析和显示这些图像。为了确保网页的兼容性和可访问性,开发者通常会选择使用JPG格式作为默认的图像格式。

总结起来,Google Chrome加载的是JPG而不是Avif和WebP的原因是因为JPG具有广泛的兼容性,几乎所有的浏览器和操作系统都能够很好地解析和显示JPG图像。而Avif和WebP虽然在图像压缩方面具有优势,但目前并不是所有的浏览器和操作系统都支持这两种格式。为了确保网页的兼容性,开发者通常会选择使用JPG格式作为默认的图像格式。

腾讯云相关产品推荐:

  • 腾讯云对象存储(COS):提供高可靠、低成本的云端存储服务,适用于存储和管理各类文件和多媒体资源。链接:https://cloud.tencent.com/product/cos
  • 腾讯云图片处理(CI):提供图像处理和转换服务,支持对图像进行裁剪、缩放、旋转、水印添加等操作。链接:https://cloud.tencent.com/product/ci
  • 腾讯云视频处理(VOD):提供视频上传、转码、截图、水印添加等功能,适用于视频存储和处理需求。链接:https://cloud.tencent.com/product/vod
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

2 分钟了解下一代图片压缩格式 AVIF

这是布兰的第 19 篇原创 一直以来,我们所熟知的或者运用到 Web 应用中的图片格式无非就是 PNG、JPG、GIF、SVG 或者 WebP,关于这些格式我总结了 2 篇文章,感兴趣的可以看看: jpg...、gif、png和svg用于web上,我们该如何选择最合适的图像格式 为你的网站加上 WebP 格式的图片吧 在介绍 WebP 的时候,我们已经知道了相比 JPG 和 PNG 来说,WebP 已经兼顾了高呈现质量以及更小的文件体积...事实上,AVIF 这种图像格式是由开放媒体联盟(aomedia.org)与 Google、Cisco 以及 Xiph.org 合作开发出来的。...然后通过对比这些大量的不同格式的图片数据,他得到的结论是: 与 JPEG 相比,WebP 格式的图片减少了 30% 的体积; 与 JPEG 相比,AVIF 格式的图片减少了 50% 的体积; 也就是说...从上图可以看到截止到目前 2021-02-03 为止,AVIF 的兼容性还只是做到低兼容,只被 Chrome 85、Firefox 86 及 Opera 71 以上的版本所支持,而其他的浏览器像 IE

5.2K30

为什么 Docker 和 Kubernetes 是用 Go 写的而不是 C# ?

HahahahahaSoFunny 为什么 Docker 和 Kubernetes 工具是用 Go 写的而不是 C#? 总所周知,现在开发人员使用的很多新工具大多是用 Go 写的。...为什么不是 C# 呢? .NET 和 C# 现在功能已经很强大了,是不是社区缺少这种文化?如何才能培养一种更加开源的文化, 因为很多开发人员对 .NET 和 C# 仍然还抱有偏见。...haho5: 不确定为什么 Docker 是用 Go 写的, 但是 Kubernetes 确实是 Google 开发的, 并且 Golang 也是。...TheAmericanBanana: 我觉得可能是在 Docker 和 Kubernetes 最开始开发时 .NET Core 还不存在( .NET Framework 确定是有的),另外,Kubernetes...它从 2.0 到现在的 10.0 变化非常快,相同的代码逻辑可以用太多不同的方式编写。 而 GO 是一门简单的语言,很受欢迎,因为好的代码应该易于阅读和理解,以便成千上万的开源程序员做出贡献。

1.1K00
  • 现代图片性能优化及体验优化指南 - 图片类型及 Picture 标签的使用

    再简单了解了解它们: WebP WebP 最初由 Google 在 2010 年 9 月发布,其特性总结如下: 可以同时提供无损/有损压缩(像 JPEG 一样)和支持透明度(像 PNG 一样)的图片文件格式...支持动画效果(像 GIF 一样) WebP 主要优势在于有损编码,其无损编码的性能和压缩比表现一般 WebP 的缺点在于其编解码性能不是特别理想 在兼容性方面,除了 IE,基本已经得到了全系列浏览器支持...也就是说,目前而言,Chrome 对 WebP 和 AVIF 等替代格式更感兴趣。 AVIF 最后,我们再来看看 AVIF 格式图片。...图片格式总结 总结一下,WebP、AVIF 和 JPEG XL 都是浏览器不广泛支持的新型图像格式。虽然 WebP、AVIF 已经存在很长时间,但到今天,影响它们大规模使用的依旧是兼容问题。...假设,没有 ,只有 元素,我们想尽可能在支持一些现代图片格式的浏览器上使用类似于上述我们提到的 WebP、AVIF 和 JPEG XL 等图片格式,而不支持的浏览器回退使用常规的

    1.1K10

    成本优化:新一代图片编码AVIF在手Q应用实践

    背景面临的问题图片瀑布流是我们手Q个性化业务最主要的表现形式,很多页面的图片资源都十分庞大。虽然之前已经做了一些优化,将除首屏模块外的所有图片进行懒加载,但是页面所需加载的资源仍然不小。...兼容性根据caniuse[2]的数据,除Safari外,Chrome、Firefox、Opera等主流浏览器均已实现对AVIF的支持。...经过实际测试后,手Q目前使用的WKWebView是不支持AVIF的,而若是使用WebAssembly等方式自行对AVIF格式进行解码,对于业务来说接入成本又过高了。...但是在会员个性化商城中,各个子商城页面上图片特征的差异是比较大的。为了证明AVIF编码对不同图片特征的压缩效果都是正向的,我们需要收集外网用户的实际资源加载大小和速度。...我们对不同页面图片的图片平均加载时间和图片平均体积进行统计,并将结果进行上报统计:以效果最好的名片商城为例,将AVIF(compress)和原图(common)进行对比:图片图片平均加载时间由3755ms

    1.2K20

    《数据万象带你玩转视图场景》第一期:avif图片压缩详解

    前言随着硬件的发展,不管是手机还是专业摄像设备拍出的图片随便可能就有几M,甚至几十M,并且现在我们处于随处可及的信息海洋里,海量的图片带来了存储问题、带宽问题、加载时延问题等等。...数据万象产出的 AVIF 图片效果对比1、AVIF 图片视觉对比以下面一张图作为例子说明 AVIF 图片的优势,保持图片分辨率不变,将图片分别转成 JPG,WebP,AVIF 格式。...从上面四张图可以看到,在经过压缩后,图片原有尺寸均不变的情况下,JPG格式的图片画质相对较差,房屋后面的云层变成大片的明显的色块色条;webp虽然没有出现色块,但整体颜色和原图相比有明显失真;avif格式的图形显示依旧平滑...,体积也很小,效果明显优于JPG和WEBP。...AVIF 图片相对 WebP 图片大小平均减小30%多,相对 JPG 图片大小平均减小50%多,相对 PNG 图片平均减少90%左右。

    74440

    《数据万象带你玩转视图场景》第一期:avif图片压缩详解

    前言 随着硬件的发展,不管是手机还是专业摄像设备拍出的图片随便可能就有几M,甚至几十M,并且现在我们处于随处可及的信息海洋里,海量的图片带来了存储问题、带宽问题、加载时延问题等等。...数据万象产出的AVIF图片效果对比 1、AVIF 图片视觉对比 以下面一张图作为例子说明 AVIF 图片的优势,保持图片分辨率不变,将图片分别转成 JPG,WebP,AVIF 格式。...从上面四张图可以看到,在经过压缩后,图片原有尺寸均不变的情况下,JPG格式的图片画质相对较差,房屋后面的云层变成大片的明显的色块色条;webp虽然没有出现色块,但整体颜色和原图相比有明显失真;avif格式的图形显示依旧平滑...,体积也很小,效果明显优于JPG和WEBP。...2、AVIF 图片质量数据对比 通过大量图片样本测试,不同的压缩质量比较图片压缩前后的文件大小、 PSNR、SSIM,将 AVIF 与最为常见的图片格式 JPG、WebP 、PNG 进行了对比,从以下的实测数据可以看出

    71510

    什么是AVIF?如何在你的网站上使用AV1图像格式的图像

    在本文中,我想谈谈它的功能和好处,以及为什么你应该开始使用 AVIF。我还将向你展示在你的网站上包含 AVIF 图像的安全方法。 什么是 AVIF,它如何工作?...AVIF 现在有来自 Google,Netflix 和 Apple 等大公司的支持者。 为什么 AVIF 更好?...在它的前辈(WebP、JPEG-XR、JPEG2000 和PNG、GIF)之后,AVIF 兼容高动态范围成像。它支持全分辨率的 10 位和 12 位颜色,所生成的图像比其他已知格式小 10 倍。...只是要记住,并不是所有的浏览器都完全支持该格式。 使用 AVIF 的最好方法是通过内容协商,我们将使用支持内容协商的 HTML 5 和 。...哪些浏览器支持 AVIF 第一个完全支持 AVIF 的浏览器是 Chrome 85。 Microsoft Windows 10 还在“19H1”更新中添加了支持。

    4K20

    使用体验 I 早知道 TDesign 支持 AVIF 图片压缩,我就不用为流量和格式发愁啦!

    它除了提供 UI 组件库以外,还提供了一套完整的设计规范和文档,可以帮助设计师和开发者更好地协作,提高产品的设计质量和用户体验。...根据最新的兼容性统计,我们可以看到,我们可以使用的浏览器版本: ● Chrome 85 + ● Firefox 77 + (77-91 需要在浏览器设置中开启 AVIF 支持功能) ● Opera 71...如下图所示,它允许渐进式支持,可以按照我们希望加载的顺序列出图像源,浏览器将加载它支持的第一个源,如果浏览器不支持,那就使用默认的链接。...imageMogr2/format/avif/rquality/75 // 如果是自行对 jpg/png 预处理为 avif,放在同名后缀下可以如下替换。...本文主要记录介绍 AVIF 图片格式在 TDesign 中的落地应用,提供一套简单快捷的方式使用 AVIF 图片格式,同时又提高 Web 和移动应用程序的性能和用户体验,便于后续其他业务接入。

    54550

    Netflix选择AVIF作为下一代图片压缩技术

    WebP 源于VP8,是Google 2010年开源出来的图像编解码算法,可以说是“含着金汤匙出生”,YouTube、Gmail、Google Play均应用WebP图片格式。...2018年之后,浏览器Edge、Firefox也宣布支持WebP格式。但就目前来说,WebP仍只被看作PNG更高效快捷的替代方案,而且Google的一些非开源的技术总是能神奇地阻碍图片的分享。...AVIF由开源组织AOMedia开发,Netflix、Google与Apple均是该组织的成员。AVIF是基于AV1的新图像格式,使用HEIF作为容器和AV1帧。...而基本的HEIF格式提供了图像格式所期望的所有典型功能,例如:支持任何图像编解码器,使用有损或无损模式进行压缩的能力,支持各种采样率和色彩深度等。...类似的集成已经在各种浏览器(例如Google Chrome)中开始应用。同时,dav1d团队也在不断努力,希望AVIF图像解码尽可能快地落地。

    62410

    Netflix选择AVIF作为下一代图片压缩技术

    WebP 源于VP8,是Google 2010年开源出来的图像编解码算法,可以说是“含着金汤匙出生”,YouTube、Gmail、Google Play均应用WebP图片格式。...2018年之后,浏览器Edge、Firefox也宣布支持WebP格式。但就目前来说,WebP仍只被看作PNG更高效快捷的替代方案,而且Google的一些非开源的技术总是能神奇地阻碍图片的分享。...AVIF由开源组织AOMedia开发,Netflix、Google与Apple均是该组织的成员。AVIF是基于AV1的新图像格式,使用HEIF作为容器和AV1帧。...而基本的HEIF格式提供了图像格式所期望的所有典型功能,例如:支持任何图像编解码器,使用有损或无损模式进行压缩的能力,支持各种采样率和色彩深度等。...AOMedia正在开发一个名为libavif的开源库,该库可以对AVIF图像进行编码和解码,目的是简化图像社区中软件的集成。类似的集成已经在各种浏览器(例如Google Chrome)中开始应用。

    1.4K30

    使用体验 I 早知道 TDesign 支持 AVIF 图片压缩,我就不用为流量和格式发愁啦!

    :Guetzli 压缩、tpg 压缩、HEIF 压缩、Webp 压缩等,近期又加入了最流行的 AVIF 图片压缩。...三、AVIF 在实际应用中遇到的问题根据最新的兼容性统计,我们可以看到,我们可以使用的浏览器版本:Chrome 85 +Firefox 77 + (77-91 需要在浏览器设置中开启 AVIF 支持功能...如下图所示,它允许渐进式支持,可以按照我们希望加载的顺序列出图像源,浏览器将加载它支持的第一个源,如果浏览器不支持,那就使用默认的链接。...imageMogr2/format/avif/rquality/75 // 如果是自行对 jpg/png 预处理为 avif,放在同名后缀下可以如下替换。...}, }), }; },};五、总结本文主要记录介绍 AVIF 图片格式在 TDesign 中的落地应用,提供一套简单快捷的方式使用 AVIF 图片格式,同时又提高 Web 和移动应用程序的性能和用户体验

    45650

    使用WebP-Server-Go无缝转换图片为Google的webp格式让你网站访问加载速度飞起来

    WebP是由Google推出的一种全新图片文件格式,也是Telegram Stickers 主力使用的文件格式,可为 Web 上的图像提供卓越的无损和有损压缩, 它是在保证原有的图像质量前提下尽可能减少图形体积的一种格式..., 使用WebP网站管理员和 Web 开发人员可以创建更小、更丰富的图像,从而使 Web 加载性能的提升更快。...在 WebP 的官网中,我们可以发现 Google 是这样宣传 WebP 的:WebP lossless images are 26% smaller in size compared to PNGs....压缩算法不会对图片所有的数据进行编码压缩,而是在压缩的时候,去除了人眼无法识别的图片细节。因此有损压缩可以在同等图片质量的情况下大幅降低图片的尺寸。 其中的代表是 jpg。...例如,使用Webp-Server并争取配置号Nginx代理后,当你访问 https://weiyigeek.top/1.jpg 时,它将作为 image/webp ,而不会更改 URL, 但对于 Safari

    1.8K20

    【学习图片】09: AVIF

    与WebP相比,AVIF更加新颖,在Chrome和Opera仅于2020年支持,Firefox于2021年支持,Safari于2022年支持。...Cloudinary和Chrome编解码器团队的其他研究也对其进行了积极的评估,与当前的编码标准相比更加优秀。...尽管工具有限,你仍然可以开始尝试使用AVIF,因为它是Squoosh提供的编码之一: 浏览器支持 如果你想知道为什么我们花费了这么多的时间讨论JPEG,而AVIF和WebP可以为我们提供更高质量的结果和更小的文件大小...GIF、PNG和JPEG的支持在所有浏览器中都是保证的,已经有几十年了。与这些传统的图像格式相比,AVIF是全新的,虽然WebP在现代浏览器中的支持非常好,但在整个网络上并不是一个常见的格式。...可以想象,开发旨在提高质量和传输大小的新图像格式所花费的时间和精力是巨大的。

    78640

    现代图片性能优化及体验优化指南

    再简单了解了解它们: WebP WebP 最初由 Google 在 2010 年 9 月发布,其特性总结如下: 可以同时提供无损/有损压缩(像 JPEG 一样)和支持透明度(像 PNG 一样)的图片文件格式...也就是说,目前而言,Chrome 对 WebP 和 AVIF 等替代格式更感兴趣。 AVIF 最后,我们再来看看 AVIF 格式图片。...图片格式总结 总结一下,WebP、AVIF 和 JPEG XL 都是浏览器不广泛支持的新型图像格式。虽然 WebP、AVIF 已经存在很长时间,但到今天,影响它们大规模使用的依旧是兼容问题。...假设,没有 ,只有 元素,我们想尽可能在支持一些现代图片格式的浏览器上使用类似于上述我们提到的 WebP、AVIF 和 JPEG XL 等图片格式,而不支持的浏览器回退使用常规的...,而不是视觉图像。

    1.5K30

    30+ 图片压缩工具集合,包含在线压缩和CLI工具

    WebUtils Bulk Image Compress  WebUtils Bulk Image Compress 允许压缩图像并将其转换为 WebP、JPG、PNG、AVIF 和 JXL。...Imagecompresser.com  Imagecompresser.com 允许同时上传多达 10 个文件,并支持 PNG、JPEG、WebP、JPG 和 GIF 格式。...Shrink Me  Shrink Me 可批量优化 JPEG、PNG、WebP 或 SVG 图像,而不会造成明显的质量损失。文件数量或文件大小没有限制,但是较大的文件将意味着较慢的压缩过程。...OptimizeImages  OptimizeImages 可减小 SVG、PNG、JPEG、WebP、GIF 和 AVIF 的大小,同时还可以选择转换为 WebP 或 AVIF。...AVIF Converter  AVIF Converter 允许任何图像格式转换为 AVIF,AVIF 是一种下一代文件格式,声称比 WebP、JPEG、PNG 和 GIF 具有更好的压缩。

    2.4K30

    数据万象AVIF图片压缩 - 小程序省流量利器

    在小程序上使用图片非常广泛,但传统格式图片(如 JPG/PNG)占用空间大,加载速度慢,可能导致昂贵的图片流量支出。近年来,AVIF 图片以高压缩率、优良画质成为省流量的新选择。...AVIF 简介 AVIF 是一种基于 AV1 编解码器的图片格式,相对于 JPEG、WEBP 等图片格式来说,它具有更小的文件尺寸,更快的加载速度和更高的图像质量。...建议开启 WebP 和 AVIF 格式,若终端支持 AVIF 图片格式,则优先加载 AVIF 图片;如不支持则会自动加载 WebP 图片格式;如两者都不支持,则自动加载原图,以适应图片在不同终端上的显示...开启了AVIF和Webp压缩配置后,在不同情况下访问得到的图片格式情况如下表所示: 3. 小程序加载图片 使用使用 CDN 分发图片,图片链接结构形式为:/。...预览效果 以示例图片为例,下表展示了 AVIF 图片和 WebP 图片的压缩率。

    39720

    位图矢量图GIFPNGJPEGWEBP一网打尽

    它们是分辨率独立的 - 我们可以调整矢量图形的大小而不会丢失质量或出现视觉伪影。 ❞ 矢量图可以帮助我们创建性能友好的 UI 设计元素、可以无限缩放,或者以极低成本制作的快速加载的解释性动画。...:支持 .jpg(.jpeg):不支持 .apng:支持(这里是apng不是png) .webp:支持 文件初始大小和压缩性能 .gif:无损压缩,文件大小较大 .jpg(.jpeg):有损压缩,文件大小较小...❞ WebP 来自维基百科的介绍 - WebP[7] WebP是一种用于网络的图像格式,旨在显示高质量但文件大小较小的图像,以改善加载时间。它可以根据我们的需要进行有损或无损压缩。...WebP格式相对较新,因为它是由谷歌旗下的一家公司于2010年创建的。 ❝WebP的主要优势是较小的文件大小,这导致了更好的用户体验和更快的加载时间。...AVIF 来自维基百科的介绍 - AVIF[8] 除了WebP在流行度上的崛起之外,还有另一种现代图像格式旨在取代JPEG、PNG和GIF。

    58410
    领券