Though not specific to WordPress, understanding this error is a crucial step in making your website run faster.
More importantly, how do you fix this error yourself?
In addition, there are other resources such as fonts and video content. But the resources mentioned above are the most important resources to focus on. At least when it comes to optimizing your website for speed that is.
This process takes more CPU resources than any other task that helps load a webpage. And this process can take a lot of time to finish, slowing the load times of your website and negatively affecting the user experience.
As a result, your site’s speed is maintained and the user experience is preserved. Plus, you make Google happy and rank higher in search results.
Async vs Defer
Both of these attributes are used in the <script> tag like these examples:
In the end, the main difference between async and defer is that async blocks the parsing of the webpage and defer does not. That’s why you should use defer any time you can.
Of course, if there are just a few scripts that you need to defer, and they are third-party or manually included scripts, then you can simply add the keyword ‘defer’ into the code as mentioned above.
To start, go to the File Optimization tab:
It’s ideal to keep Safe Mode for jQuery (recommended) enabled too to avoid any jQuery errors, especially for the inline code (code used within the page itself, instead of being loaded from an external file).
Just remember to test your website after performing these optimization steps to make sure the browser is not showing any errors.
You can do this by viewing the Developer Console, which is available in all web browsers. You can enable the Developer Console by pressing F12 and then clicking the Console tab.
This lightweight plugin has minimal features compared to a fully-featured caching plugin like WP-Rocket. And it’s free too, which is great for those on a budget.
Next, go to the Settings tab inside the plugin menu and click Apply Defer (jQuery excluded). Then, click Save at the bottom of the page.
Here’s a look at what the scripts look like before applying defer:
Webpage source code – After adding defer attribute
Note that some plugins use defer=’defer’, which is exactly the same as using the keyword ‘defer.’
Note that the position of the ‘defer’ keyword within the script tag does not matter. You can add it to the beginning like above or at the end.
The key is to remember to add it within the opening tag (shown in red below), and not the closing:
Don’t let the natural processing of your website’s code drag your site speed and performance down or ruin the user experience and your search engine rankings. Instead, take a proactive approach to site optimization and defer parsing. It’s so simple, there’s no reason not to.
If you’re interested in speeding up your WordPress website in more ways, get in touch with us at Revealize. We offer specialized website design services that are meant to help you stand out from the competition, grow your following or business, and provide an exceptional user experience to everyone that lands on your website, no matter where they come from.