优化多个HTML5视频

Question

我在创建的网页上有多个HTML5视频。他们自动播放和像GIF一样循环。

然而，该页面几乎不会加载大约6秒15秒的视频。有没有办法优化这些视频，以便页面加载它们本身更快？

编辑：

大多数Buzzfeed页面都有数十个视频＆＃34; gifs＆＃34;在一个页面上，他们加载正常。我想知道如何做到这一点？目前浏览器已经过载。

Answer 1

大多数设备都具有优化的硬件和软件来播放视频，以减少CPU并延长电池寿命。

一旦您要求设备同时播放多个视频，您就会开始超载任何最佳路径，并且播放可能会回退到软件以完成所有繁重的工作。

如果您的特定应用程序可以使用该方法，那么可以将服务器端的视频合并为一个视频。

您仍然可以通过隐藏主要控件并在相关区域添加带有单个按钮的叠加层来使其看起来像单独的视频。

如果这对您不起作用，那么将视频设置为低带宽和尽可能短的视频将会有所帮助。如果你可以避免自动播放，这显然会产生很大的不同。

作为一个注释，Buzzfeed确实在页面上有多个视频，但是当我查看他们的页面时他们不会自动播放，这意味着他们必须下载和显示的是缩略图（也许我们正在查看不同的页面 - 如果你有一个自动播放多个视频的示例页面，你能给出一个链接吗？_。