gif可以实现动态效果,但是质量和性能不好。gif采用8位压缩,最多只能处理256种颜色。gif对网络性能来说糟糕。它们体积庞大,需要更多的CPU和内存资源来重新绘制,是电池杀手。
gif也有许多优点:它们由浏览器预加载立即请求的,它会自动播放和循环播放,而且是无声的。
使用video标签可以实现效果,但是性能不好。不可以预加载。通常预加载器只会预加载javascript,CSS和图像资源,因为它们对页面布局至关重要。但是view的内容可以是任意长度,video标签会被直接跳过直到主线程准备解析其内容。更糟的是,许多浏览器都会假定video标签包含的内容很大。浏览器首先执行一个1字节的请求,用来测试服务器是否支持HTTP范围请求,而不是一次下载整个视频文件,这会浪费请求单元格数据计划。
而且video不能右键点击并保存视频,因为我们可能引用了其他网站的视频,点击会跳转到对应的网站。如果使用video标签传递微型视频,用户不能右键单击,然后保存。最后,video标签的autoplay的滥用,如果想自动播放video标签,需要删除音轨和截取内容。
safari技术预览版里可以使用<img src=".mp4">。早期的结果显示,img标签中得mp4显示速度提高了20倍,解码速度比gif等效的要快7倍。
背景css视频和响应式视频可以实现。