V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
nicoljiang
V2EX  ›  分享创造

Chrome 85+ 的同学可以来体验一下 AVIF 的神奇效果了。

  •  1
     
  •   nicoljiang · 2020-09-11 03:10:55 +08:00 · 9042 次点击
    这是一个创建于 1564 天前的主题,其中的信息可能已经有所发展或是发生改变。

    结论:Chrome 85 开始默认支持 AVIF

    AVIF 是 AV1 视频编码的静态帧( VP9 ),相较于 WebP ( VP8 )不仅有更优秀的压缩率,并且背后也有各大企业的身影( Google 、微软、Netflix 、Apple )。我能用吗: https://caniuse.com/avif

    WebP 自从被 Chrome 默认支持后就迅速普及,更优秀的 AVIF 也不会例外( https://jakearchibald.com/2020/avif-has-landed/

    AVIF 的效果到底如何,我做了一个对比网页,比较几个图片格式在极致压缩的情况下质量差别: https://www.dogedoge.com/image_formats/ (桌面 Chrome 85 以上版本适用)

    看点主要有两个:

    • 普通压缩 JPEG量化压缩 JPEG 的质量差别(图 1 vs 图 2,目前还没有看见国内的图片服务支持 JPEG 的自动量化压缩)
    • WebPAVIF 的质量差别(图 3 vs 图 4 )
    多吉图床的用户调用 fmt=avif 参数即可输出 avif 格式
    AVIF 目前不支持 内容协商机制;
    AVIF 目前不支持 Quality ( q )参数,系统会直接忽略
    

    广告

    前续

    150 多天前发布了「图片存储 & 实时处理」服务: https://v2ex.com/t/659652 部署该服务的原动力是因为在国内没有发现好的服务:

    • 阿里 OSS / 腾讯云 COS 等重在云存储,图片处理只能说基本可用

    • 七牛 / 又拍云 等虽然早期以图片处理为卖点,但支持的特性也颇为基础

    • 国外的优秀服务用起来水土不服

    然而,图片到目前为止依旧是互联网上最大的流量种类之一,所以我希望落地一个能保持「前沿性」的媒体存储与处理服务(当前聚焦静态图片)

    主要卖点有:

    • 免费的 AI 裁剪:自动识别图像主体 —— 智能应对网站、APP 各种不同的显示尺寸;

    • 准确的颜色管理:对 sRGB / P3 / Adobe RGB / ProPhoto / FOGRA 系列 / JapanColor 系列 色彩空间有完善地支持 —— 对摄影爱好者友好(为什么有些图片即便裁到 100x100 也是数百 k 的容量?);

    • 支持内容协商机制的 Webp 输出:不支持 Webp 的客户端会收到原格式 #又拍云支持

    • 极致的容量压缩追求 —— 支持 PNG 、JPEG 的量化压缩( TinyPng + TinyJpeg )、支持 Tinysrgb

    • 支持 HEIF / HEIC 的照片读取:iPhone 拍摄的 HEIF 可直接上传并对外发布 #七牛支持(目前不支持 HEIF / HEIC 的输出主要原因是该格式的专利问题比较复杂)

    • 支持 AVIF 格式的 读取 / 输出:相比 WebP 压缩率更高、相比 HEIF / HEIC 没有复杂的授权问题

    相关资料:

    什么是色彩管理? Color Management: https://zhuanlan.zhihu.com/p/72530732

    AVIF 万能吗?目前还未必: https://jakearchibald.com/2020/avif-has-landed/

    第 1 条附言  ·  2020-09-11 13:43:20 +08:00
    纠正一下,AV1 不是 VP9,是 VP10,相对应的 WebP 是 VP8 。
    HEIF 是基于 VP9 。
    28 条回复    2020-09-14 12:47:31 +08:00
    xstmjh
        1
    xstmjh  
       2020-09-11 03:40:08 +08:00
    比较关心原始视频压制成 AVIF 的性能比较

    比如源生 h264,源生 raw 装成 avif 对比 jpg 的耗时
    wdhwg001
        2
    wdhwg001  
       2020-09-11 04:02:27 +08:00 via iPhone
    我更关心和 heif 之间的质量对比,以及和 guetzli jpg 之间的质量对比。
    最好能有量化数据,比如 ssim 、psnr 和 butteraugli
    nicoljiang
        3
    nicoljiang  
    OP
       2020-09-11 04:19:17 +08:00
    @wdhwg001
    跟 HEIF 不会有太大差别。
    但 HEIF 有比较麻烦的授权问题,所以几乎注定不会大规模普及。

    至于 Guetzli,1MB 处理起来要 1G 内存 + 5 分钟 CPU 时间 的性能让它几乎没有任何实用意义(甚至不值得花心思去想起它)。
    wdhwg001
        4
    wdhwg001  
       2020-09-11 04:45:58 +08:00 via iPhone
    @nicoljiang 它对于有限数量的网络资源还是非常有价值的,压缩时间只是开发的时候支付就可以了。
    yyfearth
        5
    yyfearth  
       2020-09-11 06:00:24 +08:00   ❤️ 2
    @wdhwg001 @nicoljiang 我倒是对 H266 的 VVIF 更加感兴趣 估计苹果会率先支持确定 HEIF
    而且貌似 VVIF 理论上压缩率应该比 AVIF 还要好 但是授权问题嘛 估计不会比 HEIF 好

    如果能对比 JPG HEIF VVIF AVIF 会比较有意思
    wdhwg001
        6
    wdhwg001  
       2020-09-11 11:51:09 +08:00 via iPhone
    @nicoljiang 你不能总用服务器二压的思路去考虑嘛,实际上一些用户是愿意自己去压缩以提升图片质量的,guetzli 可以让他们去压,也可以 asm 跑在浏览器里的,b 站就是这个思路,而且你们图床怎样都是分发二进制,那么让用户用高参数二压又何尝不可呢。
    nicoljiang
        7
    nicoljiang  
    OP
       2020-09-11 11:52:14 +08:00
    @wdhwg001 Guetzli 的压缩率不如 AVIF,甚至不如 WebP,压缩性能远比 WebP 和 AVIF 高。如果是保存珍贵资料,也必然是新格式更好,就像苹果做的那样。
    @yyfearth HEIF 和 AVIF 比较起来其实会比较麻烦,他们本身同宗同源,理论上质量相差无几,粗略的对比可以但目前的压缩算法和底层编码器存在一些差异,所以在调参的不同对比效果差异,很难公正公平。更不用说同种格式内不同编码器的带来的效果和性能差异可能还大于不同格式之间的差异。

    至于 VVIF 目前资料还太少,我没有任何涉及。但几乎可以确定的是,回看过往优秀的图片格式非常多,HEIF/C 不是第一个也不是最优秀的那一个,都难以替代 JPEG 还是因为授权问题造成的阻碍,WebP 是第一个有望大规模取代 JPEG 的新图片格式,AVIF 或是下一代,再下一代不太会是 VVIF 。
    nicoljiang
        8
    nicoljiang  
    OP
       2020-09-11 12:03:57 +08:00
    @wdhwg001 可若是低效低能,为什么要去做这个事情呢,无论是服务器还是客户端。压 2-30 张照片的时间都能压缩一部 60 分钟的 4K 视频了。

    别人有做过一些对比: https://cloud.tencent.com/developer/article/1004742https://arstechnica.com/information-technology/2017/03/google-jpeg-guetzli-encoder-file-size/

    但需要注意的是:这里提到 29%的压缩率,仅仅是相对 LibJPEG 产生的结果,而不是 TinyJPEG 的结果(也就是 我那个对比网页当中的 图 1,而非图 2 )

    对比网页: https://www.dogedoge.com/image_formats/

    从这两张图片来看,TinyJPEG 就已经可以轻易获得 30% 的压缩率( 36.75%),效果还更好:

    LibJPEG ( 16.6 k ): http://dfs.dogedoge.com/~/source/unsplash/photo-1599524882167-39718267c453?x-oss-process=image/resize,w_500/quality,Q_20/interlace,1

    TinyJPEG ( 10.5 k ): https://rmt.dogedoge.com/fetch/~/source/unsplash/photo-1599524882167-39718267c453?auto=format&fit=crop&w=500&q=20&prog=1
    wdhwg001
        9
    wdhwg001  
       2020-09-11 13:08:12 +08:00 via iPhone
    @nicoljiang 说起来你那个对比页要不要对不支持的浏览器嵌入一个 avif.js…
    hronro
        10
    hronro  
       2020-09-11 13:09:21 +08:00 via iPhone
    AV1 可不是 VP9,第一句就错了
    nicoljiang
        11
    nicoljiang  
    OP
       2020-09-11 13:39:42 +08:00
    @hronro 我想表达的是,相当于 VP9 。
    @wdhwg001 我搞了一晚上 avif.js 搞不定。前端太南了
    nicoljiang
        12
    nicoljiang  
    OP
       2020-09-11 13:40:20 +08:00
    @hronro 我看了一下,确实不当。
    yyfearth
        13
    yyfearth  
       2020-09-11 14:00:38 +08:00
    @nicoljiang 在 web 上自然 VVIF 完全没戏和 HEIF 一样 Firefox 和 Chrome/Chromium 估计就不可能支持 顶多 Safari 会去支持
    但是 iOS/macOS 上面 VVIF 取代现在用的 HEIF 还是很有可能的 Apple 两边都是成员

    现在苹果系统马上就要支持 VP9/WebP 的情况看 支持 AV1/AVIF 的可能性还是很大的
    但是苹果喜欢用有自己参与的有版权的东西 而且要和 web Android 产生优势和一定的壁垒 所以既然支持 HEIF 那么支持效果更好压缩比更高的 VVIF 的可能性也是很大的
    除非 AVIF 压缩比不比 VVIF 差 而且很多系统都支持都很好 那么苹果才有可能用 AVIF 而不是 VVIF 替代 HEIF/JPG
    nicoljiang
        14
    nicoljiang  
    OP
       2020-09-11 14:11:30 +08:00
    @yyfearth Apple 支持 VVIF 和 HEIF 也不妨碍支持 AVIF 吧。毕竟应该天然有生态优势。AVIF 是第一个有望慢慢全面替代 JPEG 的格式吧?
    hronro
        15
    hronro  
       2020-09-11 14:35:58 +08:00 via iPhone
    @nicoljiang 相当于 VP9 也不对。AV1 最早起源于 Google 的 VP10,属于 VP9 的下一代。
    nicoljiang
        16
    nicoljiang  
    OP
       2020-09-11 15:49:21 +08:00
    @hronro 是,我找到资料,更正了。
    yyfearth
        17
    yyfearth  
       2020-09-11 18:33:08 +08:00
    @nicoljiang 我意思是 Apple 更可能用 VVIF/VVC 取代现在的 HEIC/HEVC 作为默认的照片 /视频存储格式
    我也没有否定 Apple 会同时支持 VVIF 和 AVIF 我猜未来他们的 Safari 和系统内建 App 应该都会支持 毕竟 Apple 两边都是会员
    如果 Chrome/Firefox 支持 AVIF Safari 没道理不支持 而且都支持 webP 和 vp9 了
    同样既然支持了 HEIC 没道理不支持 VVIC (不过当然要等 VVC 技术成熟后)

    目前看来 Apple 支持 AVIC/AV1 可能比支持 VVIC/VVC 要早
    nicoljiang
        18
    nicoljiang  
    OP
       2020-09-11 19:20:44 +08:00
    @yyfearth 我是认为苹果可能会考虑用 AVIF 作为默认(或可选)存储格式( VVxx 成熟后另当别论)
    oahebky
        19
    oahebky  
       2020-09-11 20:13:27 +08:00 via Android
    大佬发文,暂时用不上也先收藏再说
    starrystarry
        20
    starrystarry  
       2020-09-11 23:19:44 +08:00
    突然发现 Safari13@Mojave 支持 WebP 了
    mxalbert1996
        21
    mxalbert1996  
       2020-09-12 01:10:21 +08:00 via Android
    HEIF 难道不是基于 HEVC ? HEVC 和 VP9 是两个东西。
    okaku
        22
    okaku  
       2020-09-12 09:17:04 +08:00
    AVIF 现阶段压缩时间是 jpg 的 50 倍,压缩一张照片我的老 macbook pro 需要几十秒甚至一分钟!
    renmu123
        23
    renmu123  
       2020-09-12 10:29:59 +08:00 via Android
    webp 目前支持还不是很好,新的又出来了
    nicoljiang
        24
    nicoljiang  
    OP
       2020-09-12 13:02:04 +08:00
    @mxalbert1996 还是我没有弄的太清楚,想把这些都放到 VP8/9/10 的系统去对比。
    @okaku 对的,所以要用上一些优化的策略,但收效没有太大,Guetzli 还是 AVIF 的十倍。顺带一问,你照片多大?
    @renmu123 webp 目前已经基本算全平台支持了。长久以来怕是没哪个新格式能做到了。
    expy
        25
    expy  
       2020-09-13 14:50:46 +08:00
    希望能干掉 gif 。现在的 gif 动图分辨率跟帧率稍微好点,存储占用就爆炸。
    用视频编码来压缩,压缩率跟效果应该能吊打 gif 。
    ExplorerLog
        26
    ExplorerLog  
       2020-09-13 18:33:33 +08:00
    Firefox 77+ 开启

    about:config

    image.avif.enabled --> true
    xiaoping1111
        27
    xiaoping1111  
       2020-09-14 01:02:51 +08:00
    据说火山引擎的 HEIF 编码方式自己实现的, 压缩比很高,可以看看,volcengine.cn 有个 ImageX 图片服务,专门做图像处理;另外,问过,传言 avif 很快也将实现;内部用 GPU 、Fpga 来做的图像处理;
    nicoljiang
        28
    nicoljiang  
    OP
       2020-09-14 12:47:31 +08:00   ❤️ 1
    @xiaoping1111 这家我知道。不过压缩比高不高,跟编码器关系应该不是太大。自有的编码器可能可以提高性能、避开一些授权雷区,但通常做了一些取舍或阉割。没有试过,但我目前了解到的 fpga 图片方案有一些局限,比如颜色管理做的不好。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3747 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 00:59 · PVG 08:59 · LAX 16:59 · JFK 19:59
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.