Optimizing “Defer Parsing of JavaScript” on GTmetrix

GTmetrix Test Result JS Deferred

This is what I did to optimize this site’s score on GTmetrix test result. I believe you can also use the same method on your WordPress blog. However, there are also other methods you can try but so far I found two easiest methods.

First, by adding this lines of code to 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 onload='";
}
add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );

Second, this method is common and easier than the first method : by installing WP Deferred JavaScripts plugin. You can download the plugin here or simply look for it directly from the install plugins page in your blog. The plugin works by deferring the loading of all JavaScripts (.js) files added by the way of wp_enqueue_script(), using LABJS (Loading And Blocking JavaScript) – an asynchronous javascript library. Moreover, the plugin is compatible with all WordPress JavaScript functions (wp_localize_script(), js in header, in footer…) and works with all WordPress plugins as long as they are well-coded.

What does defer parsing JavaScripts mean? Shortly, you should make the html content loaded earlier than any JS scripts. Unluckily, moving all .js files to the footer area of your site is not always the solution. Third-party scripts like social media or social sharing scripts (Facebook, Twitter, etc.) will slow down your site’s performance.

Asynchronous-Deferred-Javascript

And the final result is shown in the screenshot pic above.

signature

Leave a Reply

Your email address will not be published. Required fields are marked *

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