您如何在 WordPress 网站上推迟对 YouTube 视频的 JavaScript 解析? [英] How do you Defer Parsing of JavaScript for YouTube video on a WordPress site?

问题描述

我今天才意识到在我的 1.2 MB 网站(每个 GTMetrix)中，有 550k 是 YouTube 视频.

I just today realized that of my 1.2 MB site (per GTMetrix), 550k of it is a YouTube video.

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

My web site is a WordPress site, and the current video loads in an iframe.

我希望我的网站加载速度更快...但不知道如何继续.如果我可以让 YouTube 视频在点击之前不加载，而只是在那里有一个缩略图，那么这似乎是正确的播放方式?

I want my site to load faster... And not sure how to proceed. If I can make the YouTube video not load until clicked, and just have a thumbnail there instead, it seems like that would be the right play?

推荐答案

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;

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

Now your site will load faster compared to past.

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

I have following this blog and it's working for me : http://www.codecanal.com/defer-parsing-javascript-youtube-videos/

这篇关于您如何在 WordPress 网站上推迟对 YouTube 视频的 JavaScript 解析?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！