MP4代表了Internet上提供的视频的75％以上，是当今最常用的格式。 但是，MP4经常使用不当，这可能会对用户体验产生不利影响。 让我们看看如何改善这一点。
无论您是希望播放超高质量视频的奢侈品牌公司，还是想要引人注目的提案的新闻平台，视频都已成为短短几年内Web必不可少的一部分。 但是，将视频添加到站点可能是具有挑战性的。
- 欢迎来到Refereum 2.0
- Netflix凭借“罗马”提名保持电影业
- 夏季流媒体
- 内部音调-第3部分：播放引擎
- [教程]带有Go聊天服务器的异步Flutter聊天客户端，该客户端由gRPC提供支持（简单和流式传输）
毫无疑问，最广泛使用和支持的编码是H.264，由MP4文件提供。 大多数视频处理软件都支持这种格式：手刹，MPEG Streamclip，OpenShot甚至VLC！ 但是其中很少有人提供专用于Web的导出。
但是，您不会像在台式计算机上那样在Internet上广播视频。 有一些注意事项。
免责声明：以下示例将大量使用 ffmpeg ，它是开发人员中最流行的视频编辑程序之一，但是大多数优化应该在您喜欢的软件中可用。
减轻文件重量：质量与性能之间的恰当平衡
繁重的视频会导致页面总重量增加。 请记住，某些Internet提供商出售的软件包的总带宽是有限的。 使页面不必要地沉重将不会对访问者有所帮助。
要优化您的视频，您需要问自己如何通过网络传递其内容。 即使文件大小看起来很小，也可能会提高比特率以实现最佳扩散。
比特率是多少？ 简单地说，比特率是编码一秒钟视频所需的数据量。 每秒分配的数据越多，质量越好，但文件越重。 我没有一个可以计算出完美比特率的神奇公式。 相反，我想邀请您问问自己有关每种视频使用要求的质量。
例如，根据视频中出现的突然变化评估必要的比特率很有趣：内容越固定，分配给视频每一秒的数据就越少。 或者，如果视频包含很多运动，则等效质量所需的比特率将增加。
通过使用整个视频的恒定比特率或多遍编码，可以轻松地预测编码后的视频重量。 这是对2009年6月“奋进”号发射镜头的原始10秒摘录与使用ffmpeg的两次通过编码之间的比较。 经过优化后，左侧部分的权重为85MB，右侧视频的权重为1,2MB：
如果您的服务器不支持范围请求，则浏览器别无选择，只能下载整个文件。 如果您的视频处于自动播放状态，则会减少可用于下载呈现页面所需的其他资源的带宽。 显示所需的时间将增加，从而降低用户体验。
MP4文件可分解为几个数据单元，称为原子。 元数据包含在电影原子电影中，也称为moov原子。 MP4creator或AtomicParsley之类的软件可以帮助您可视化MP4文件的原子。
有几种方法可以将moov原子移动到第一位置。 Handbrake之类的软件提供了“ Web优化”选项。 在其他软件中，此选项称为MP4“快速启动”。
ffmpeg可以通过-movflags faststart选项快速纠正视频，运行第二遍将moov原子移动到文件的开头（请参阅文档）：
ffmpeg -i origin.mp4 -acodec copy -vcodec copy -movflags faststart fast_start.mp4
如果您想了解有关电影原子的更多信息，请不要错过Maxim Levkov的“ Understanding the MPEG-4 Movie Atom”。
有针对性的多种表现来源
尽管h264是使用最广泛且受支持的编解码器，但不一定在每种情况下都最有效。 我们已经看到标记接受多个来源，从而允许浏览器为Chrome用户获取WebP图像。 元素也可以接受多个源，并且视频的WebP等效项是WebM。
ffmpeg可以对WebM文件进行编码，前提是该文件与--with-libvpx选项一起安装。 这是使用VP9视频编码器以1MB目标比特率进行两遍编码的示例（在Windows上，请用NUL替换/dev/null ）：
ffmpeg -i source.mp4 -c:v libvpx-vp9 -b:v 1M -pass 1 -f webm /dev/null && ffmpeg -i source.mp4 -c:v libvpx-vp9 -b:v 1M -pass 2 output.webm
根据本文开头介绍的Endeavor Shuttle的优化1.2MB视频，此命令生成715KB的WebM文件，即减少了40％的重量 。 糟糕的是，WebM没有得到更广泛的支持。
最后的建议
注意自动播放 。 如果使用不当（例如，以微妙而毫不干扰的方式，例如在英雄背景下），这种做法不仅会被许多用户负面评价，而且视频播放总是会占用一些带宽，从而减慢了其他资源的下载速度。
如果要以全高清播放视频或最大化UX，请使用行业领先的解决方案。 有各种各样的SaaS或设备用于管理，编码和广播内容。 无论您使用流解决方案，在线视频平台（OVP）还是企业视频内容管理器（ECVM），您的用户都将欣赏自适应比特率流。 如果他们可以访问高质量的网络，则视频清晰，色彩丰富。 如果他们的网络突然失去了容量，则视频会通过牺牲一点质量来适应，以保持播放流畅。 为了应对这一挑战，JavaScript脚本会检测每个用户的当前带宽，并在以不同比特率编码的多个视频版本之间动态切换视频源，从而确保在任何情况下均具有最佳的用户体验。 如果您有兴趣，请查看Brightcove，Kaltura，Qumu等。
有时候，最好的视频就是没有视频 。 在某些情况下，尤其是装饰性视频时，请不要犹豫隐藏视频。 放置适当的CSS媒体查询，您可以使移动用户免受不良体验的困扰。 另外，请考虑支持“保存数据客户端提示”，因为它是显式选择加入降低数据使用模式的浏览器。
TL; DR
- 通过使用取决于视频内容和目的的优化策略来减轻文件的重量 。
- 通过对视频进行编码以尽快提供元数据来优化流 。
- 提出MP4的替代方案 ，例如WebM。
- 请注意自动播放功能，考虑专用于全高清的解决方案，并在需要时毫不犹豫地隐藏视频。
感谢 RavanaRenoncé 和 Rick Viscomi 的帮助。
