How to Defer Parsing of JavaScript in WordPress

How to Defer Parsing of JavaScript in WordPress

There are a few reasons why we should defer parsing of JavaScript in WordPress. The most important one is speed and performance. Generally, JavaScript is placed between the <head> </head> tags. When opening a website, it loads the code from top to bottom. This means that if you have lots of JS or long strings, it will take more time for the website’s content to appear, as it first waits for all the JavaScript to load.

By deferring parsing of JavaScript, the website would not wait for the JS code to load, which would result in a quicker loading time. Nowadays, optimizing a website for social media is crucial. Such features as Facebook, Twitter, Google+, Linkedin and other social network sharing buttons or feeds use JavaScript. However, we must keep in mind that content should be the priority, meaning that by deferring parsing of JavaScript we can greatly increase front-end user experience and SEO ranking. In this WordPress tutorial, we will cover several ways on how to defer parsing of JavaScript in WordPress.

Step 1 — Analyzing the site

To find out whether you should defer parsing of JavaScript in your WordPress website, you should analyze with using a tool such as GTMetrix. The average score for this recommendation in GTMetrix is at least 71%. Here are the results of analyzing a test WordPress site:

Defer parsing of JavaScript WordPress warning in GTMetrix.

Step 2 — Deferring parsing of JavaScript in WordPress

There are several options to choose from that will help you defer parsing of JS.

IMPORTANT! Make sure to backup your website before proceeding.

Option 1 – Deferring parsing of JavaScript via WordPress plugins

One of the easiest and quickest ways to defer JS parsing in WordPress is by using plugins. The following can be done using a variety of plugins and we will shortly overview the most popular options. To begin, you will need to login to your WordPress Dashboard and access Plugins Add New section.
Adding a new plugin via WordPress dashboard

Option 1.1 – WP Deferred JavaScript

A light-weight and very easy-to-use plugin. You will only need to install and Activate it.
defer parsing of javascript via wp deferred js plugin

Option 1.2 – Speed Booster Pack

An alternative plugin with additional optimization techniques, such as query string removal, loading JS from Google Libraries and more. To begin, install and Activate the plugin.
WordPress Speed Booster Pack activation

Next, navigate to your WordPress Dashboard, click on Settings and enter Speed Booster Pack.
Speed booster pack settings in WordPress dashboard

Tick the box near Defer Parsing of Javascript Files and Save Changes to apply it.
Defer parsing of Javascript files in wordpress via speed booster packconfirm deferring of js in wp

Option 1.3 – Async JavaScript

Async JavaScript plugin enables defer or async attributes to WordPress JavaScripts which loads via `wp_enqueue_script` function. The following attributes force JavaScript to load deferred or asynchronously, resulting in faster page load. To use it, you will only be required to install and Activate the plugin.
Async JavaScript plugin activation



Option 2 – Deferring parsing of JavaScript via functions.php

Alternatively, it is possible to carry out the task by editing one of WordPress core files. To defer parsing of JS, this code should be copied to the bottom of your theme’s functions.php file:

function defer_parsing_of_js ( $url ) {
if ( FALSE === strpos( $url, '.js' ) ) return $url;
if ( strpos( $url, 'jquery.js' ) ) return $url;
return "$url' defer ";
add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );


Step 3 — Testing the changes

Once you’ve are finished with one of the above options, use the same website speed tool and test your website. Here are the performance results after deferring JavaScript parsing in WordPress:

Defer Parsing of Javascript WordPress success in GTMetrix website optimization score

Congratulations, by following these few easy steps, you have boosted your website’s performance for a quicker and better experience!


In this short guide, we have learned how to improve the speed and performance of your WordPress website by deferring parsing of JavaScript. Remember, the faster and smoother your site is, the more traffic and happier visitors you will have!

Related articles:

The Author


Gediminas B. / @gedziuzzz

Gediminas was a passionate content writer and SEO geek at Hostinger. He started his journey at customer support and aims to use his gathered knowledge to create the most epic content the world has ever seen. From WordPress to server management, there's no topic he can't cover! He also likes cats.

Related tutorials


Brian Reply

April 13, 2017

Hi, thanks for the article. I tried the code both in my Wordpress wp-includes/functions.php file and my theme functions.php file and neither worked. Do you have any idea why it wouldn’t work?



    Replied on April 13, 2017

    Thank you for contacting us. In some cases, the specific configuration in WordPress (.htaccess, specific plugins or other settings) may cause issues when trying to defer parsing of JS. In such cases, we would recommend deferring parsing of JavaScript via WordPress plugins. For more specific information, see Option 1 found in Step 2


Candell Reply

April 13, 2017

Thanks for this, it works great with one exception, it caused Yoast SEO to break. Can we exclude Yoast from being deferred?



    Replied on April 13, 2017

    It is possible to exclude scripts from being deferred when using the “Speed Booster Pack” plugin. You will be required to access the Settings section of your plug-in, and there will be a selection that says “Exclude scripts from being deferred.” There, you will need to specify the JS file that you wish to exclude. For example `jqueryfile.min.js. If you are planning on excluding more than 4 scripts, the plugin authors suggest to disable deferring parsing of JavaScript altogether, as your page speed score might be affected.



    Replied on May 12, 2017

    you need yoast SEO plugin to work only on wp-admin section, so bypass deferring using this: if ( is_user_logged_in() ) {} else { /* content written above */ }



    Replied on May 18, 2017

    use this to not break Yoast SEO (it checks if user is logged in) if ( is_user_logged_in() ) {} else { function defer_parsing_of_js ( $url ) { if ( FALSE === strpos( $url, '.js' ) ) return $url; if ( strpos( $url, 'jquery.js' ) ) return $url; return "$url' defer "; } add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 ); }


123project Reply

April 13, 2017

Hi I tried both codes, both of them worked but I think this method is not compatible with woocomerce because many woocomerce features not work when inserting that code!


William Reply

April 24, 2017

I put in functions.php : function defer_parsing_of_js ( $url ) { if ( FALSE === strpos( $url, '.js' ) ) return $url; if ( strpos( $url, 'jquery.js' ) ) return $url; return "$url' defer "; } add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 ) It made my website crash. I had avada themes. Be careful.


    Domantas G.

    Replied on May 04, 2017

    Hello, It may be different for Avada theme, their support should provide you the code to defer parsing.


    rakesh kumar

    Replied on January 07, 2019

    Hi Basically this code loads in admin panel as well as front end. this is the reason your website crashed. It should load only on the fron-end. If you will load this only in front end then it should work.


Milius Reply

April 27, 2017

Hi Sr can you make some array with this? I mean...I wanna exclude jquery. js and todo.js function defer_parsing_of_js ( $url ) { if ( FALSE === strpos( $url, '.js' ) ) return $url; if ( strpos( $url, 'jquery.js','todo.js' ) ) return $url; return "$url' defer='defer"; } add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 ); But not work


Jim Miesner Reply

May 02, 2017

Hi. Thanks for this article it improved my page speed when I did this through the speed booster pack in wordpress, but then my background video didn't load. Is there a way to keep the background video active on my website and still defer parsing?


Antoine en road trip Reply

May 04, 2017

It looks weird to put your code in function in wp-includes ? Are you sure it is not in function.php of the theme ?


    Domantas G.

    Replied on May 04, 2017

    Hello, Yep, you are right. Fixed!


Webbing Barcelona Reply

June 21, 2017

Not working properly any of this 3 plugins :/ not even the code applied on the functions.php. The main problem is the Home slider, it doesn't appear... Any other option to solve it? Thanks!


    Domantas G.

    Replied on June 23, 2017

    Hey, Try to exclude your home slider JavaScript from deferring.


Amit Kumar Reply

January 06, 2018

Hi Thanks for this article it improved my page speed when I did this through the WP deferred javaScript in wordpress.


Marco Reply

January 26, 2018

Thank you. Very useful post!


Anuj Godara Reply

February 26, 2018

Thanks for giving a good tips to us


Bob Reply

March 25, 2018

That is amazing. I added the php code and the site went to A100% on both page speed and YSlow scores using GTmetrix. Before that it had been in the B/C range. I'd brought it up from D/C speeds by adjusting the served image sizes, but this code really made a difference. It seems to have fixed a number of other issues also, not just the defer parsing. I'm lazy so I tried the ASync plugin first, but that didn't appear to affect anything. Thank you!



    Replied on March 25, 2018

    ok I need to retract that. The site wasn't available after I added the code. That could account for the increased speeds. Any suggestions?


Mike Reply

February 26, 2019

Awesomeness!!! Keep up your excellent work! this code really works for me. Cheers, Mike


Baswoko Reply

May 22, 2019

two thumb up it's add speed to my website from 57 to 70 on google speed test on mobile Thank you

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Become a part of Hostinger now!

More in WordPress
How to Translate a WordPress Theme Using Poedit