你如何推迟在WordPress网站上为YouTube视频解析JavaScript？

Question

我刚刚意识到我的1.2 MB网站(每个GTMetrix),其中550k是YouTube视频.

我的网站是一个WordPress网站,当前视频加载在iframe中.

我希望我的网站加载更快......而且不确定如何继续.如果我可以在点击之前不加载YouTube视频,而只是在那里有缩略图,那么这似乎是正确的游戏？

Answer 1

1. 将“scr”替换为“data-src”

<iframe width="560" height="315" data-src="https://www.youtube.com/embed/123456789" frameborder="0" allowfullscreen></iframe>

2. 添加Javascript

function init() {
var vidDefer = document.getElementsByTagName('iframe');
for (var i=0; i<vidDefer.length; i++) {
if(vidDefer[i].getAttribute('data-src')) {
vidDefer[i].setAttribute('src',vidDefer[i].getAttribute('data-src'));
} } }
window.onload = init;

与过去相比，现在您的网站加载速度更快。

我关注了这个博客，它对我有用：http : //www.codecanal.com/defer-parsing-javascript-youtube-videos/

Answer 2

最好、更快的方法是将视频 iframe 替换为链接或图像等内容，然后在单击或其他事件时加载 iframe。

Ahmed Essam 为您提供了一个解决方案，但如果您不想或不知道如何编辑 WordPress 安装上的文件，嵌入视频缩略图插件可以完成这项工作：

https://wordpress.org/plugins/embed-video-thumbnail/