Question

当前我有一个项目问题。我有完整的高清视频，想在背景播放。视频是h264编码的。问题是视频很长，所以有90MB。但是即使使用200MBit连接，我也必须等待约5秒钟才能开始播放视频。

我该怎么做才能防止这种情况？

我使用以下代码：

<video autoplay muted loop id="myVideo">
  <source src="video.mp4" type="video/mp4">
</video>

我想拥有和Netflix一样的性能。只需单击一下即可开始播放视频。

怎么可能？

Answer 1

您可以采取一些措施来帮助您

1 /优化视频以快速启动。 MP4文件中的MOOV原子通常位于末尾，这意味着它必须先到达该原子，然后才能开始播放。使用ffmpeg可以将其移到前面：

ffmpeg -i source.mp4 -a:v copy -a:c copy -movflags faststart output.mp4

（这将复制视频和音频，而无需进行任何更改，只需更改程序包即可）

2 /您可以将preload属性添加到视频源，以允许浏览器根据自己的规则进行优化，以进行预加载

<video preload="auto" muted loop....>

这会有所帮助，但仍然不能让您“立即”开始。

3 /根据页面的大小，您可能希望在页面加载时将视频预加载到Blob中，以便在完全缓冲并可以使用时显示“播放”按钮。解决方法请参见this answer（而不是在此处重新键入）

4 /大多数浏览器都支持自适应流式传输（HLS或MPEG-DASH），因此您可以创建片段化的mp4文件，以允许“即时”以低比特率/质量开始播放，该速率随浏览器/视频播放器（例如， jwPlayer）检测并适应网络条件