loading="lazy" 但对于 html5 视频

【问题标题】：loading="lazy" but for html5 videosloading="lazy" 但对于 html5 视频
【发布时间】：2021-10-11 10:02:43
【问题描述】：

我正在用烧瓶制作一个可滚动的画廊，其中显示许多<video> 元素，视频文件很小，但它仍然会生成很多 http 206 请求，这是瓶颈烧瓶。

<img>有loading="lazy"，非常方便。

除了<video>，是否有某种方式（仅 javascript 或 css）来实现此类行为？

我可以使用preload="none"，但它不会显示第一个视频帧。

【问题讨论】：

【解决方案1】：

您可以使用此解决方案的一部分：

<video preload="none" src="video.mp4" 
       autoplay="false" poster="poster.jpg"
       muted="false" loop="false">
</video>

如果 preload 是none，网络浏览器不会预加载媒体，但我建议用海报属性替换图像。

预加载说明here

自动播放说明here

循环解释here

海报解释here

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。