Parsing a String in Javascript
Have you checked the 11 best image optimizers to speed up your website?
Okay, this post is not about the image compressors but the render-blocking JavaScript strings which delay our page load.
Let us start to defer the parsing of JavaScript which can eventually speed up our site.
Some of the WordPress themes do not support parsing of javascript. If the code is not working for you then you can once contact your theme developer.
WHAT IS PARSING A STRING IN JAVASCRIPT
In layman’s language, parsing means breaking a component into its logical and syntactic parts.
While loading a page, its browser must parse all the contents which adds additional time to the page load. So by minimizing CSS, and JS files and delaying javascript load until it is required to be implemented, we can delay the initial load time of the page.
HOW TO DEFER PARSING OF JAVASCRIPT WORDPRESS
I would recommend using this method by including some coded lines in your function.php files to defer parsing of javascript.
I always prefer using less number of plugins as they add to the initial load time of the page.
If you are not sure where to add the codes then follow the steps.
Warning! Copy the original files separately before editing function.php or htaccess. As minor mistakes can mess up your site.
1.WordPress Dashboard> Appearance> Editor
2. On the right side of the page, you will find all your PHP files.
3. Click on Function.php > Scroll down to the end and add the following set of codes.
/* Defer Parsing of Javascript*/
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 );
WHAT HAPPENS WHEN WE DEFER JAVASCRIPT LOADING
Generally, JavaScript is placed in the head section and a website is loaded from top to bottom.
So if we have a long string of JS to be read then website content will take a longer time to appear as it has to wait until all the JavaScript codes are finished.
When we add codes to defer parsing of JavaScript then it instructs the browser that it does not have to wait for the entire JavaScript codes to finish, but rather can display content while it is being executed.
Thus it speeds up the initial load time of the website.
PARSING A STRING IN THE JAVASCRIPT WORDPRESS PLUGIN
If you are not comfortable with the codes then the plugin is a way to play safe.
Lazy Load is a powerful plugin that loads images while you are scrolling down the pages.
Thus it would wait till the time the user can see the particular image preventing loading all the images together on a page which renders to delayed load time.
Install from WordPress Plugin> Activate
No setup is required. It will start working right away.
It will make your blog way faster.
WRAPPING UP
NOTE: This is what I do for solving deferred parsing of javascript in WordPress. Some have said that the code is not working for them and I have no idea why. So if it is working for you then kindly put it as a comment.
If you check the GT Metrix there are many more issues that need to be solved.
Next, we will see how to remove query strings from static resources.
Before checking the site speed you should empty the browser cache for better results.
Check out all the factors affecting WordPress site speed.
Carlos Olaaka
Monday 10th of June 2019
How about in htaccess please?
moumita
Thursday 13th of June 2019
Hi Carlos, sorry I could not defer any javascript by any coding in htaccess file.
rishi
Friday 31st of May 2019
/* Defer Parsing of Javascript*/
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 );