Defer Parsing Of JavaScript With YouTube Videos – Gomahamaya

Defer parsing of javascript with YouTube videos are the major factors for decreasing your website speed when we check our website speed in tools like GTmetrix and Pingdom. Does that really mean to you when you load a YouTube video? Before loading the content YouTube frame will get loaded which creates a blockage of page rendering. And finally, it will result in such errors

You may also be interested in leverage browser cache, Caching Plugins, and security plugins 

Error of Pingdom Tool and Gtmetrix

There are 3 JavaScript files served from www.YouTube.com. They should be combined into as few files as possible.

• https://www.youtube.com/yts/jsbin/player-vflUPJQPD/en_US/base.js (1.0MiB)
• https://www.youtube.com/yts/jsbin/player-vflUPJQPD/en_US/remote.js
• https://www.youtube.com/embed/ntUy_3AMsTs (3.3KiB of inline JavaScript)
• https://www.youtube.com/yts/jsbin/www-embed-player-vflMWxoKL/www-embed-player.js (84.7KiB)

So, in order to fix Defer parsing of JavaScript with YouTube videos we need to eliminate javascript loading from the scene.

You can Defer JavaScript files by 2 methods:

• Without using any kinds of plugins
• By using plugin

How to Defer Videos Without Plugin

When you embed any video you will get code like this

In the above, you need to replace the src by src=”” and add a youtube video URL like this data-src=”//www.youtube.com/embed/ntUy_3AMsTs”

So final code will be like this

Now you need to tell the browser to load all the javascript files of the embedded video after the page loads. Then you need to add the below code before the end of the body tag.

How to defer videos By using WordPress plugin

There are many plugins that can be used to fix your job

1. wp-rocket 

2. Lazy Load for Videos

3. WP YouTube Lyte

If you are using WP Rocket then there is an option in the plugin which says lazy loads videos. You can check that option and you are ready to rock.

But here, we will learn How to Fix Defer Parsing of JavaScript with YouTube videos using the WP YouTube Lyte plugin in WordPress.

How to properly set up and configure WP YouTube Lyte 

1. You need to install and activate the WP YouTube Lyte plugin.
2. You need to get a youtube API
3. And paste in the API section and test. You will get a success message.

4. And NOW select the required setting and click on save the change. You are ready to rock.