Have you ever finished a WordPress website and loved everything about it? Then immediately started hating it after realizing it took forever to load?
Not only are slow loading speeds a nuisance to you and your visitors, but they can also cost you significantly when it comes to SEO. Since 2010, Google algorithms have taken the loading speed into account when making ranking decisions, so that slow pages appear lower on the results pages.
In this post, we are going to show you how to remove that annoying code from your WordPress website and improve your performance.
- Run a site scan again.
- Check your website for errors.
When the scan is complete, Google will assign your website an overall speed value from 0 (slowest) to 100 (fastest). A score in the 50 to 80 range is average, so you should land in the upper part of this range or above.
You will see a list of files that are slowing down the “first painting” of your page. In other words, these files affect the loading time of any content that appears when the page is first loaded in the browser. This is also known as “over-the-fold” content.
Be aware of any files that end with the .js extension as this is what you want to focus on.
After identifying the problem, there are two ways to fix it in WordPress: manually or with a plugin. We’ll cover the plugin solution first.
1. Install and activate the Autoptimize plugin.
2. In your WordPress dashboard, select: Settings> Optimize automatically.
4th When the box next to Aggregate JS files? is enabled, disable it.
5. Click at the bottom of the page Save changes and empty cache.
6th Rescan your website with PageSpeed Insights and look for improvements.
8th. click Save changes and empty cache.
1. Install and activate the W3 Total Cache plugin.
2. A new performance The option will be added to your WordPress dashboard menu. Choose Performance> General Settings.
3. By doing Minimize Check the box next to Minimize, then adjust Minimize mode to Manual.
4th click Save all settings at the end of this section.
5. From the Dashboard menu, select Performance> Minimize.
6th By doing JS Section next to Minimize JS settings, Make sure, that Activate Check box is activated. Then under Operations in areas, open the first one Embed type Dropdown and choose Non-blocking with “postponing”.
7th Under JS file managementSelect your active topic from the theme Drop down list.
10. Rescan your website with PageSpeed Insights and look for improvements.
Plugins can do the backend work for you. On the other hand, plugins themselves are just files added to your web server. If you want to limit these additional files or if you prefer to do the programming yourself, you can manually address the render blocking code.
To do this, find the tags in your website files for the resources identified in your PageSpeed Insights scan. They will look something like this:
Tags instruct the browser to load and execute the script identified by the tag src (Source) attribute. The problem with this process is that loading and executing it delays the parsing of the webpage by the browser, which affects the overall loading time:
To fix this you can either add the asynchronous (asynchronous) or the move Attribute to the script tags for render-blocking resources. asynchronous and move are placed like this:
While these attributes have similar effects on load times, they instruct the browser to take different actions.
Scripts with the move Attributes are also loaded while the page is being analyzed. However, these scripts are only loaded after the first rendering or after loading the more important parts:
The move and asynchronous Attributes should not be used together for the same resource, but one may be better suited to a particular resource than the other. Generally, when a non-essential script is based on a script to be run beforehand, use move. The move The attribute ensures that the script is executed after the previous required script. Otherwise use asynchronous.
3. Run a site scan again.
After making your changes, take a final scan of your website through PageSpeed Insights and see what impact your changes had on your score.
Hopefully there will be a noticeable improvement, but if not, don't worry. Many factors can affect page performance and are worth finding and eliminating.
4. Check your website for errors.
In addition to a re-scan, double-check your pages to make sure your website is working. Is the page loading correctly? Are all items displayed? If something is broken or won't load properly, roll back your changes and fix the problem.
When you've reached the point where you've repeatedly tried various measures with minimal speed gains, you should consider other ways to speed up your pages rather than risking damaging your website.
Optimize your site for users
Many factors contribute to the user experience on your website, but few are more important than loading time. Whenever you make large changes to the content or appearance of your WordPress site, you should always consider how such changes will affect performance.