Question

使用html 5 video代码时，preload="metadata"属性是否已加载视频？如果视频大小超过100MB，我有点担心页面加载时的性能问题。

我注意到，当拥有此属性时，会加载视频第一秒的图像，但不会完全播放视频。

<video width="320" height="240" controls preload="metadata">
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Answer 1

根据规范，它不应该下载整个视频，只下载元数据，但WebKit浏览器显然会在元数据之前预加载整个视频。

我希望这会有所帮助。

另见：Problem retrieving HTML5 video duration

Answer 2

preload属性向浏览器提供有关视频本身的乐观下载或其元数据是否值得考虑的提示。

元数据不会立即下载所有视频的元数据。规范建议将其设置为元数据。

此处列出了所有可用选项：

none - 提示用户可能不会观看的浏览器   视频，或最大限度地减少不必要的流量是可取的。

元数据 -   向浏览器提示用户不需要视频，   但是获取其元数据（尺寸，第一帧，曲目列表，   持续时间等等是可取的。

auto - 提示浏览器   乐观地下载整个视频是可取的。

更多信息：https://developer.mozilla.org/en/docs/Web/HTML/Element/video

Answer 3

也许我会把我的2美分... 一直适用的解决方案是在VIDEO html标记中设置“自动播放”“静音”选项。然后，当页面完全加载后，我会暂停，在显示视频之前取消静音并以JavaScript倒带视频。上帝...如果没有JS我们该怎么办。 HTML缺少一些稳定的跨浏览器选项sometines :)希望这对某人有帮助。

Answer 4

这取决于浏览器和设备。

Chrome浏览器会在台式机上缓冲25秒的视频，但在iOS或Android上不会缓冲。

这意味着在移动设备上，可能不会在台式机上发生播放启动延迟：https://developers.google.com/web/fundamentals/media/video#preload

html 5上的元数据预加载属性是否加载了整个视频？

4 个答案: