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 pack confirm 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 development by deferring parsing of JavaScript. Remember, the faster and smoother your site is, the more traffic and happier visitors you will have!