html - Safari - 视频加载太慢

Question

我在我的网站中实现视频时遇到了一些麻烦。

我使用这段代码:

<video id="video-background" poster="/video/video-poster.jpg" autoplay loop muted playsinline>
    <source src="/video/video.webm" type="video/webm">
    <source src="/video/video.mp4" type="video/mp4">
    <source src="/video/video.ogg" type="video/ogv">
</video>

在 Safari 以外的任何浏览器中打开时，视频会立即加载。我还没有看到它在播放之前需要超过 5 秒的时间。

在 Safari 中打开时，视频需要将近一分钟才能开始播放(甚至可能更长)。

任何人都可以为这种疯狂添加一些理由，以便我可以:
1) 提高 Safari 的性能...
2) 给我的经理找个好借口...

我检查了所有的视频声明——它们都是工作视频。
我已经尝试移动声明视频的顺序。

谢谢，杰森。

Answer 1

我的假设是视频具有默认编码 - 通常使用 mp4 视频，最后一步是编写 MOOV最后包含有关帧位置等的元数据和信息的原子。这意味着在文件被完全读取之前，浏览器并没有所有可用的信息。

您可以使用 FFMPEG 解决此问题(开源，免费，大多数平台都可以下载)并在视频上进行第二次传递以将 MOOV atom 移到前面:

./ffmpeg -y -i source.mp4 -movflags faststart dest.mp4