How to speed up WordPress

Working with many websites you see varied page loads times for website, some slow and some fast. This can sometimes be down to the server and that’s something we can’t do much about, unless the host is changed. There are a few simple changes that you, as a developer, can make to any WordPress site to ensure that it is running smoothly at all times.

I’ve put together these changes that can be made:

1. Latest WordPress Version

Image may be NSFW.
Clik here to view.

Keeping up to date with the latest WordPress version is always important for security to any website. With the updated security in every WordPress version there are also performance increases and more efficient coding practices taken to minimise the coding.

WordPress updates will always become better overtime and give maximum use of WordPress to both developers and users. Remember though, when updating to a newer version of WordPress that you should always back up your database and theme file before hand. Just in case anything does go wrong.

2. Plugins

We are all guilty are downloading plugins to see what they are like and leaving them enabled even when not using them. Heck we even disable them and never delete them, but yes you guessed it you’re still slowing your site down by having these there. Depending on what plugins you have on the site they can either contain a little or a lot of scripting. If you’re not using them disable them, if you know you wont ever use it delete it!

Keep those that you decide to keep updated as well, the same principles apply from the WordPress version, the latest update will be the most secure and hopefully more code efficient.

3. Efficient and Clean Coding

Developers can be the key issue for slow loading WordPress website as their code is what runs the site. Optimising that coding can make your website run much smoother and load quicker, below are a few examples on how to clean the code up.

Remove whitespace
This is a patchy area as many coders like to use white space for better readability and organisation. However for all those extra line breaks you’re adding a few more bytes onto your file size.

A quick CSS example of white space:

1
2
3
4
5
6
7

body{
    font: 12px/22px Verdana, Geneva, sans-serif, Calibri; 
    color:#676767;
        text-decoration:none;
        border:0;
        padding:0;
}

And without:

1

body{font: 12px/22px Verdana, Geneva, sans-serif, Calibri; color:#676767; text-decoration:none; border:0; padding:0;}

I personally find that the first method is better for reading the styles, where as the second method is better for locating specific container references.

Shorthand CSS
With using shorthand CSS you’ll be saving bytes off the CSS file again! Its also easier to work with and is better for your browser and site.

An example of regular CSS:

1
2
3
4
5
6
7
8
9
10

#someid{
    font-family: Verdana, Geneva, sans-serif, Calibri;
        font-size: 12px;
        line-height:22px;
    color:#676767;
        padding-left:10px;
        padding-right:15px;
        padding-top:20px;
        padding-bottom:25px;
}

And then again in shorthand CSS:

1
2
3
4
5

#someid{
    font: 12px/22px Verdana, Geneva, sans-serif, Calibri;
    color:#676767;
        padding:20px 15px 25px 10px;
}

Looks a lot tidier and neater eh!?

External Scripts
You could also use external scripting within the header.php file instead of having lots of snippets of javascript in the header. This way the browser can cache the file so it doesn’t have to be loaded every time the page is loaded.

Example javascript link

1

<script type="text/javascript" src="example.js"></script>

All of the above might on only be small changes and reducing file sizes by a matter of bytes, but every little bit will help reduce page loading times.