How to speed up your WordPress site • WP Blog

Hi everyone.

You are here because you want some information how you can speed up your WordPress site as much as possible.

You have come to the right place. I’ve accelerated a lot of sites over the years. Every time I do my work, I put all my knowledge and skills into it. And I feel great pleasure when I manage to speed up a very slow and heavy site on WordPress.

I used a lot of techniques to increase page speed. And I hope that I will be able to pass on all the relevant information in an understandable and accessible manner, which you can easily apply for yourself.

Why you need to increase page loading speed

You probably already know that websites should load as fast as possible. Maybe you have read this information in technical reports and audits. Maybe you have seen the related warnings in webmaster tools.

Indeed, page load affects how visitors behave on a website and how a page is ranking in search results.

Mobile usability and page load time have been given high priority in modern web development.

Fast sites are always lovely and cool. They show respect to visitors, value their time, and make browsing more comfortable.

Let’s set smart goals for acceleration. How do you estimate a page loading time? What speed grade you can achieve?

First of all, it’s essential to make a visual assessment. A person can feel even small delays in time. The problem is that even your internet speed can differ from the internet speed of a visitor. Therefore, this visual speed assessment will remain subjective.

You will also not be able to visually determine the exact page weight, blocking parts, and other vital parameters. You can use online tools for measuring speed about which you may have already heard.

I recommend using gtmetrix as the most straightforward and most convenient service, with proper evaluation and recommendations.

Here’s what the Gtmetrix speed report looks like (old version).

Как измерить скорость загрузки WordPress в сервисе GTmetrix

New updated Gtmetrix report in 2020.

 

Make sure you have made a backup

By configuring caching and doing some optimizations, you most likely will not break anything. But you should protect yourself from any possible dangerous action.

For example, over compressing and cutting images can be dangerous without keeping originals. Updating the engine, themes, and plugins can cause errors, as any manual code corrections.

Make sure you have made a fresh backup.

Frankly speaking, you should make any changes and tests on a separate site copy. So, you will be safe from any actions that could interfere with the working site.

You can make a backup or a site clone any way you like. Here are some plugins that will help you.

I often use them as very convenient tools.

Budget hosting or expensive hosting

Most hosts offer modern application stacks and good computer characteristics, such as powerful CPU enough memory and fast SSD disks.

Each hosting has its advantages and disadvantages. But in general, they are not that different. So it is difficult to choose one.

I want to highlight hosting SiteGround, which in my opinion, is the best.

Its main principles are speed, safety, and good user experience.

The SG Optimizer plugin that integrates into this hosting creates a noticeable speed difference. You will be pleasantly surprised.

How updates are relevant to site speed and safety

Always update your site code.

In my practice, a widespread reason for a visually slow page load and lags is in missing updates for a long time. Of course, these problems are usually gone with updates.

Developers frequently solve problems, fix bugs, improve code, speed, and compatibility with other plugins.

If you are not taking updates, you will not take all improvements and fixes (which you will find in official changelogs).

Without updates, your site will eventually break down at a time when you will not be ready for that.

Plugins that are not updated are not safe to use. They make your site vulnerable to viruses and various hacker attacks.

Remove unused plugins

I’m sure you have some plugins that aren’t very helpful. I have some, too. Sometimes you look for functionality, add it through a plugin, and not actually using it.

Look at the list of all installed plugins on your site. Even those that seem useful to you. Think carefully about the value that each of them has for you. Can you replace their functionality, or can you just delete them?

The extra plugins slow down your site, make it less secure, and increase its support cost.

The fastest code is code that doesn’t run!

The acceleration of a WordPress site should always start with the study of active plugins. It is better to remove a useless function than to lose in speed.

Disable additional fonts

The problem is that many plugins add their own fonts. Perhaps some of them you can safely disable.

There is also extensive use of google fonts. Even if you disable these fonts entirely, the browser will display the content in standard system fonts.

Switching off additional fonts is the best option for speed. But if you cannot disable them, optimize fonts delivery in Autoptimize, WP Rocket, LS Cache, or another optimization plugin.

Configure your server for best optimization and delivery

For best performance, you should select a new version of PHP on the server. Sometimes, you have to turn on compression and configure the caching of static resources in the .htaccess file. Most popular optimization plugins like W3 Total Cache, WP Rocket, WP Fastest Cache do this automatically.

Turn on gzip compression

Gzip compression is the first step to reduce page size, and you should enable it on all pages on your site.

Text documents are very well compressed, including HTML, CSS, JS. There are many such resources on the WordPress site, and you can reduce the total page size several times.

Usually, hosting enables compression by default. If not, you need to write some instructions to the server configuration file .htaccess.

You can take the code from here to enable gzip compression via .htaccess.

Set up browser caching

Add expire headers for static resources.

On many hosting services, you can just add the following code to the .htaccess.

An example – Add Expires Header to WordPress.

Plugins for caching and code optimization

There are many plugins for WordPress caching. But which one to choose?

WP Super Cache. One of the best-known caching plugins. To work on mobiles, it requires an adaptive theme or installed extension WP Touch.

WP Fastest Cache. A free version exists, but some essential features are available only in the premium version.

W3 Total Cache. One of the oldest caching plugins with a lot of settings. It is useful if you have Memcached installed on the backend.

I often use a simple, lightweight Cache Enabler caching plug-in in conjunction with the Autoptimize optimization plugin. Results are always excellent.

What is missing in Cache Enabler is a cache preloading and a separate caching for mobiles.

Autoptimize does a great job of optimizing code. And in most cases, it doesn’t require any technical knowledge.

Сжатие и объединение HTML, JS, CSS в плагине Autoptimize
Optimize WordPress with Autoptimize plugin

If you are lucky, you can simply check to Optimize HTML, CSS, and JS. Unfortunately, errors can arise on sites with complex functionality and a large number of installed plugins. Leave your comments and ask for help.

I want to say a few words about WP Rocket.

It is an excellent plugin with great options, good performance, simple, and easy to use.

But if you consider the purchase option between WP Rocket and the optimized Siteground hosting plan, I prefer the latter. It is so good.

SG Optimizer and LS Cache plugins are integrated with Siteground and with the Litespeed server. They are very popular and functional plugins. I still don’t understand why all people haven’t already switched to these servers.

Plugins for optimizing images

Currently, lazyload is used almost everywhere. So over compressing images doesn’t make any sense.

The effect of size reduction is achieved mainly by compressing large images. Sometimes I just selectively compress images through the plugin and service TinyPng. The free compression limit is 500 images a month, but that’s enough. The compression quality is fine.

You can also use computer programs or services I specified at the end of the page.

If your media library already contains a large number of files, use the EWWW Image Optimizer or Robin Image Optimizer plugins for batch compression. Resize large images before uploading to hosting.

Serve scaled images

If you are using Gtmetrix, you may have noticed the Serve scaled images recommendation.

What does this mean? The page uses a larger image size than is necessary. Then the browser automatically resizes it.

A problem with image scaling often occurs when a theme is changed. Sometimes the template registers new image sizes, but they are not created automatically for old uploaded images.

You can generate new image sizes with a simple Regenerate Thumbnails plugin.

Themes and plugins create their own image size sets, so managing them becomes more difficult. In these cases, I often use the Simple Image Sizes plugin.

On the Settings -> Media page, it displays all registered sizes, allows you to modify them (!), and generates new ones for the selected post types.

Плагин Simple Image Sizes выводит информацию о всех зарегистрированных размерах изображений.

Sometimes, it’s easier to replace the whole plugin. On one website, I saw over 30 registered sizes, 10 of which were created by a gallery plugin. This gallery was only on several pages, so we decided to replace it with built-in functionality.

Pay special attention to your site’s graphic elements – in many cases, it is a significant factor for speeding up your site.

Lazy load everything

Lazy load what you don’t need to display now.

I use A3 Lazy Load, Autoptimize, Lazy Load by WP Rocket for lazy loading images. Sometimes you will need to exclude classes or specific images if they break the webpage. But in general, it is easy to solve.

You must enable lazy load for images. It gives a good speed increase.

Lazy load for iframes and videos

The same plugins A3 Lazy Load, Lazy Load by WP Rocket do well with lazy loading videos and frames.

These options are also available in complete optimization plugins such as WP Rocket, LS Cache.

Lazy load for external scripts

You can often see external scripts on many sites, like chat, maps, analytics, ads, facebook, and others.

This code can take many requests and increase the total load time and page size. Therefore, you should think about deferring them to achieve a better page speed.

The next code shows how you can execute a js code block through setTimeout after the page starts scrolling.

<script type="text/javascript">
var loaded = false;

window.addEventListener('scroll', () => {
    if (loaded === false) {
        loaded = true;
        
        setTimeout(() => {

            // here is a block of js code 
        
        }, 1000)
    }
});
</script>

Here is the code for lazy loading Google Ads script.

<script type='text/javascript'>
//<![CDATA[
// Lazy Load AdSense
var lazyadsense=!1;window.addEventListener("scroll",function(){
    (0!=document.documentElement.scrollTop&&!1===lazyadsense||0!=document.body.scrollTop&&!1===lazyadsense)&&
    (!function(){var e=document.createElement("script");
        e.type="text/javascript",
        e.async=!0,e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
        var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)
    }(),lazyadsense=!0)},!0);
//]]>
</script>

These techniques are not very hard to use, but they require some coding skills.

Optimize database queries

Plugins installed on your site run their functions, hooks, pull information out of the database, write to it, read options – and that happens even when you don’t see it.

Fortunately, there are easy ways to display debug information. For example, using the popular Query Monitor plugin, you can easily track slow queries and their source.

There is a useful wp-cli profile command for more detailed code profiling that helps to find slow code at different stages when the page is loading.

Use CDN to speed up your WordPress site

If you have a broad audience worldwide, if traffic has grown enormously, you can connect CDN to speed up and cache your website.

On my site, I use the free Cloudflare plan.

Siteground has an easy option to connect Cloudflare, which gives you one more reason to like this hosting.

List of useful online services

Various online tools that you can find helpful in the process of site acceleration.

My WordPress speed up service

If you want the job to be done by a professional, you can hire me on freelance.

 

I wish you success in speeding up your site!

If you like this article, please share it and leave comments.

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x
Scroll to Top