GIF 转 MP4 压缩动图体积：网站优化实用指南

GIF 采用 LZW 无损逐帧编码，每一帧都存储完整像素信息，不利用帧与帧之间的内容冗余做压缩。这种编码方式在1987年设计，受专利和算法限制，压缩效率存在天然瓶颈。

H.264 编码采用帧间压缩技术，只存储相邻帧之间差异的部分，静态背景只需存储一次，不需要在每一帧重复存储。相同画质下，H.264 压缩后的体积远小于 GIF。

多数场景下，相同内容的 GIF 转 H.264 MP4 后，体积相差 5 到 10 倍。部分长时长、静态背景占比高的动图，体积差距会超过 10 倍。

网站加载体积每降低 100KB，首屏加载速度可提升约 10 毫秒，大范围替换 GIF 为 MP4 可明显降低页面总加载体积。

要在网页中实现 GIF 原有的自动播放、循环播放效果，可使用 HTML video 标签，组合四个属性即可完成模拟。四个属性分别为 autoplay、loop、muted、playsinline。

示例完整写法为<video autoplay loop muted playsinline src="demo.mp4"></video>，该写法兼容 Chrome 86+、Safari 11+ 等主流现代浏览器，可以实现无点击自动循环静音播放。

Twitter 对用户上传的 GIF 自动转码为 H.264 视频，用户前端仍显示 GIF 形态，实际加载视频流降低带宽消耗。微信公众平台对上传 GIF 也执行类似的自动转码处理。

多数主流内容平台均已采用类似机制处理用户上传的 GIF，降低平台带宽成本同时提升用户加载速度。

部分传统邮件客户端不支持HTML video标签的自动播放，邮件营销场景使用GIF可以保证多数客户端正常显示动效。很多早期企业内部系统仅支持GIF格式的动图上传，无法处理MP4格式。

部分第三方表情平台对上传内容有明确格式要求，要求必须上传GIF格式动图，这类场景需要保留原格式。