阻止YouTube嵌入加载播放器JS的多个实例?

时间:2016-11-08 作者:omega33

我注意到,在我工作的许多WordPress网站上,如果嵌入了多个YouTube视频,就会调用多个播放器JS实例。

由于这是一个完整的兆字节数据,我试图确定是否有办法只加载一个JS实例。我认为第二个(或更多)实例是多余的。

以下是两次加载的内容,对于一个包含两个嵌入式视频的WP页面。

https://s.ytimg.com/yts/jsbin/player-en_US-vfle0WwUC/base.js (1.0MiB)

我一直找不到有关这方面的任何信息,这有点令人惊讶,因为我认为这将是许多人想要解决的问题。

有什么建议吗?

2 个回复
SO网友:Mark Kaplun

理论上,youtube嵌入是作为iframe进行的,iframe是虚拟附加的independent 在同一窗口中呈现的网页,因此一个iframe的内容不能对其他iframe产生影响。

实际上,这样的JS将缓存在浏览器中。第一个可能会被加载,但第二个(除非谷歌有人有一个巨大的oooops时刻)将从浏览器的缓存中“服务”。

为了直接回答这个问题,wordpress方面没有什么可以避免的,很可能也没有什么需要做的

SO网友:jgraup

Google I/O 2011: YouTube\'s iframe Player: The Future of Embedding 将告诉你过去的未来。您可以在YouTube Developer 但我会先看那个视频,了解他们为什么选择iframe。

通常,静态资产(如JS文件)由浏览器缓存。这意味着未来的请求将从浏览器的缓存中提取,而不是获取新的副本。文件头中写入了一个称为TTL(生存时间)的东西,它决定了项目可以缓存多长时间。某些资源设置为0,在这种情况下,下一个请求将不会从缓存中提取。但我的直觉是谷歌将他们的TTL设置得相当合理。

如果您想找到一个只允许对单个脚本排队而不允许对iframe排队的替代方法,请考虑覆盖YouTube的默认嵌入。只需记下第一次创建嵌入以添加脚本,然后每隔一次显示视频标记即可。

add_filter(\'embed_oembed_html\', \'override_youtube_embed_oembed_html\', 99, 4);

function override_youtube_embed_oembed_html($html, $url, $attr, $post_id) {

    static $count = 0;

    $pos = strrpos($url, "youtube.com");
    if ($pos === false) {
        return $html;
    }

    $message = \'\';
    if( ! $count ) {
        $message = \'First bit of embed magic! \';
    }

    $count ++;
    return $message . "Your Magic Here! How many magics so far? " . $count;
}