大多数人没有意识到,在自己喜欢的网站中以动画GIF形式嵌入的短动画会带来巨大的性能,电池,文件大小和带宽损失。动画GIF对于网络性能而言非常糟糕:它们的文件大小通常比H.264视频大12倍,而加载和显示在浏览器中的能量却是其2倍。而且由于仅有微不足道的256色调色板,它们的色彩范围有限,而且总体上看起来不太好。
这是因为根据原始GIF89a规范的措辞,即使可以有限的方式完成,GIF(图形交换格式的首字母缩写)也“不旨在用作动画平台” 。
值得庆幸的是,苹果的Safari浏览器似乎可以帮助终结使用GIF作为微格式视频,模因和可爱动画的网络默认格式的做法。
这是因为Safari Technology Preview(Safari技术预览版)是Safari的特殊版本,开发人员可以在macOS和iOS中测试即将到来的Web技术,它的最新更新允许Web开发人员在HTML“ img”标签中嵌入MP4等真正的视频格式。
Colin Bendell 现在 (通过 Daring Fireball的John Gruber)展示了Mac版Safari技术预览版中这一炫酷新功能的关键优势:在“ img”标签中嵌入真正的.MP4视频文件,渲染速度快了20倍,快了7倍解码和它的GIF相比,除了文件大小的四分之一外。
图表A:来自Colin的原始文章(其中嵌入了一些GIF动画用于说明目的)在Chrome上为46 MB。在Safari技术预览版中,同一网页只有2 MB,其GIF转换为MP4并与“ img”标签一起使用。
“现在,我们的微型视频可以小而有效(例如MP4),并且可以轻松地预加载,自动播放和共享(例如我们的老朋友GIF),”科林很好地总结道。
这种方法的其他好处包括能够轻松保存或共享此类动画,使用HEIC(H.265编解码器)以4K格式创建节省空间的动画等功能。
下表包含的表格说明了Colin仅通过转码giphy.com上趋势发展的前100个GIF动画文件并将其转换为H.264,H.265,VP8,VP8和WebP即可成功实现的字节大小节省视频格式。
这种方法并非没有潜在的缺陷,因为目前,将MP4动画包装在“ img”标签中通常会带来一系列复杂的问题,需要开发人员方面进行大量手动工作以确保将来的兼容性。
就是说,如果您想亲自测试该新功能,则必须从Apple下载Safari Technology Preview。Safari Technology Preview可以与计算机上已经安装的Safari商业版本共存。