Javascript 在网页上加载视频的最佳实践？

想了解AirBnb如何能够在其主页上如此快速地加载20MB的背景视频文件。在浏览了他们的主页之后，我注意到视频没有出现在任何下载的资源中，这使得它的分数如此之高。当我尝试这种策略时，通过AJAX异步加载视频，视频仍然作为下载的资源显示在WebGetTest上，但就在DOM加载之后。所以我真的不确定AirBnb是如何做到这一点的。有人有什么想法吗？

AirBnb在这里没有做什么特别的事情。他们刚刚开始使用渐进式下载播放媒体，这意味着播放在视频仍在下载时开始

在CDN上，他们上传了一些相当大的MP4文件，具有两个重要特征：

索引信息（MOOV atom）已移动到MP4文件的开头

视频以浏览器支持的格式和编解码器进行编码

由于这些特性，站点所要做的就是告诉浏览器开始播放源URL，它会做正确的事情：向CDN发出web请求并开始下载文件。一旦传输了足够的数据开始播放，它就会这样做

最后，我不能确定为什么WebGetTest没有向您展示驱动视频的视频MP4，但它们确实存在，URL看起来像。我怀疑他们是在看你的用户代理来决定向你发送哪个文件，而根本没有向谷歌和WebGetTest这样的机器人发送任何视频

---

你无法通过WebGetTest了解真实情况。不要依赖第三方在他们的环境中评估页面，你应该观察实际发送的流量或Chrome Developer Tools上的“网络”选项卡。

我在网站上看不到背景视频。@KevinJantzer如果你去airbnb.com等几秒钟，背景图像就会转换成视频。如果您检查DOM，您将在hero中看到以下代码：

，根据您的浏览器支持，hero有两个视频源。这些视频链接到了

muscache.com

，我想这是AirBnb的CDN。看起来像是流媒体。@j08691您能详细解释一下吗？和WebSocket一样？喜欢