The SideGains Page Load Speed Test – How I Improved Page Speeds

I’m kicking off today with a description of how to run a page load speed test on your site. This has been a very important subject for me during SideGain’s first month so I’ll set the scene for you to explain why!

I launched SideGains around 30 days ago on 26th June 2019. As you can imagine I’ve been pretty busy since then!

I purchased the SideGains.com domain and configured it, installed WordPress and I’ve been writing blog posts furiously from that point.

I’ve also been trying to optimize SideGains because one of the things that has been really bothering me is the time it was taking pages to load.

Site and page speed is something that bothers Google too.

Want to Really See a Difference in Your Page Load Speed?

SiteGround took my mobile page load speed from 77 to 93 in Google’s PageSpeed Insights tool… read how in my SiteGround review.

Why is Site & Page Load Speed so Important?

There many reasons why your pages should load quickly. You can read a more in-depth discussion here: Why Is Page Load Speed so Important?

Basically people do not wait around for slow pages to load. If a site takes too long, they’ll click the back button and bomb out of your site. Of course this is not good.

Search engines don’t like slow sites either. Site speed is a ranking factor for Google and because of this slower sites get minus points in the search results accordingly.

With this in mind, I made it my priority to fix the SideGains page load speed issues.

What follows then is an experiment to show you how to understand how quickly your site loads and how to make improvements.

At each step I will show you how SideGains performed before and after making changes to deliver faster page load speeds.

SideGains Page Load Speed Analysis

Firstly I’ll give you some information about the SideGains set up as this has a bearing. 

• It is a WordPress site.
• I was running 2 plugins: Yoast SEO and Contact Form 7.
• I installed the MH Newsdesk theme, which I have customized.
• At the start of my optimization the site was hosted with HostGator.

N.B. I’m trying to run as few WordPress plugins as possible since they can affect page load speeds.

So I had the feeling my site speed was slow, what do I do next?

The first thing I need to do is to run some baseline test to identify the speed before optimizations. Where better to go than Google?

The Google PageSpeed Insights (PSI) tool tells you from the horse’s mouth how quickly Google can load your site. Additionally it reports how much time each page element takes to load.

It’s an excellent tool and one that I have been using frequently in the past week to get to the bottom of what factors are causing the site lag I’ve seen.

It’s a simple tool to use.

You plug the URL you want to analyze into the search bar, submit it and wait for the response. It takes a minute or so until the analysis is complete, after which the PSI gives your page a speed score out of 100 and details the elements you need to examine.

So how well did SideGains do?

SideGains Page Load Speed Test Scores & Recommendations

I ran a page load speed test on the 10th July 2019 against the SideGains homepage. Below are the reports for mobile and desktop from that time.

You can see that SideGains received an Orange score of 77 for mobile and a Green score of 91 for desktop.

Find out more about PSI Scores.

So… SideGains has an average speed for mobile and a fast speed for desktop. 

Now these aren’t awful by any stretch. However, I definitely want to try to get a Green for mobile and as close a score to 100 as possible. I know that if I can achieve this for mobile, my desktop speed will surely improve too.

SideGains Lab Data Report for Mobile

The amber color of every item in the Lab Data report indicated that the SideGains homepage has average load times… so there was room for improvement!

SideGains Mobile Opportunities Audit

PageSpeed Insights showed that render blocking resources (critical CSS and JavaScript) and server response times were contributing to slowing down page load speed (they are shown in red).

It also reported that SideGains needed to enable text compression, use more optimal image formats as well as optimize the CSS and existing image formats correctly (encode images).

If I could streamline these areas I would improve the page load speed of the SideGains homepage and hopefully see this reflected in the PSI report for both mobile and desktop.

SideGains Mobile Diagnostics Audit

The Diagnostics Audit presents more information about how to improve other aspects of the SideGains homepage.

Ensuring text remains visible during webfont load means that the page text is hidden until the Nobile webfont I’m using for SideGains loads. This isn’t good for visitors as text should always remain visible even if the webfont is not fully loaded. It makes sense really because this presents visitors with meaningful text content while the font loads.

Find out more about webfont load.

Serve static assets with an efficient cache policy means that I haven’t specified to browsers how long they should cache (temporarily store) items such as images and CSS. Caching enables browsers to pull such resources from the local temporary store for a specified period rather than requesting a download from the SideGains site each time it’s required.

Minimize Critical Request Depth reports upon requests to the SideGains site for resources that are important for the page to render meaningfully such as CSS, JavaScript and fonts. If I can reduce the length of these chains or reduce their size I can speed up page load.

Keep request counts low and transfer small sizes recommended me to set budgets for the quantity and size of certain resources required for the SideGains homepage to load. This is pretty meaningless without specific examples so I’ll come onto this later.

SideGains Mobile Passed Audits

The Passed Audits report shows that 13 important elements are being handled correctly, so these don’t need to be fixed. I won’t list each of them here since I only want to outline the total count to see if I could increase the number of Passed Audits through making improvements recommended by the PageSpeed Insights report.

So What Was My Plan?

Based upon the Google PageSpeed Insights report I decided that I needed to make the following changes asap (other improvements I could look at later):

1. Get a faster host;
2. Fix render-blocking CSS and JavaScript, which were preventing browsers from processing the homepage content quickly;
3. Configure the web server to send compressed text over the network;
4. Serve next generation images rather than standard JPEGs I’ve been using;
5. Implement a more efficient cache policy;
6. Clean up HTML and CSS by removing comments, unnecessary spaces, etc.
7. Ensure text remains visible during webfont load.

Hosting

The first item on my list was to look for a faster web host. As I mentioned earlier, I set up SideGains on the HostGator reseller server I have used for many years, mostly as a place to develop. 

While I’ve been happy with HostGator, SideGains was not enjoying fast page load speeds so I figured it should not reside there permanently. So I set out to look for a new host.

I spent a day or so looking around for something that would offer superior speeds and support and wanted to get as much bang for my buck as possible.

So I settled on SiteGround through looking at their offering, reviews and a host of recommendations from other bloggers. I should mention that it had nothing to do with the SG connection! I’ll explain my detailed reasons for choosing SideGains in another post.

SiteGround Hosting Packages

Basically, SiteGround offers 3 types of hosting package:

Since I will want to host other sites there too I opted for the GrowBig package. Additionally it’ll take a while to get to the 25k monthly visits on the GrowBig package, so it seemed unnecessary to pay for the top package GoGeek, even though it is very reasonably priced.

The GrowBig package is currently offered at the bargain introductory price for the first year: 

GrowBig UK Year 1: £4.95/month and £14.95/month after the first year (prices exclude VAT).

GrowBig US Year 1: $5.95/month and $19.95/month after the first year.

So I bought GrowBig and migrated SideGains across to the SiteGround server on Friday 12th July 2019. 

It was a very simple process, in fact a SiteGround WordPress plugin called SiteGround Migrator handled the whole thing.

I changed the DNS configuration for sidegains.com at Namecheap (where I registered the domain) and by Monday 15th July SideGains was running completely from the new SiteGround host.

Fixing Other Issues Reported by the Page Load Speed Test

My next step was to research fixes for render-blocking resources, sending text over the network, serving next generation images, delivering a cache policy, tidying up HTML/CSS and showing text during webfont load!

I spent the better part of Tuesday 16th July researching fixes for these issues when I realised that SiteGround actually handles these things for me out of the box!

As part of the migration process, SiteGround automatically installs its own WordPress plugin to optimize all these areas!

The plugin is called SG Optimizer and once activated it just requires you to switch on the components you want. For me it handles all the issues listed above apart from one: keeping my text visible while my webfont is loading.

This is an easy one to fix as I just needed to add a few lines to my CSS to cover it.

@font-face {
  font-family: 'Nobile';
  font-style: normal;
  font-weight: 400;
  src: local('Nobile'), local('Nobile-Regular'), url(https://fonts.gstatic.com/s/nobile/v10/m8JTjflSeaOVl1iGWa3WWrZNbg.woff2) format('woff2');
  font-display: fallback;
}

Find out more about how to ensure text remains visible during webfont load.

So… I had now implemented the majority of the larger issues affecting page load speeds and it was time to run another page load speed test with the PSI tool.

Here are the results:

This is beyond what I expected… so you might say I am happy!

Not only was the WordPress migration to SiteGround really straightforward but the combination of a new server and the SG Optimizer tool has delivered incredible results.

Before & After Page Load Speed Test Results

Below is a before and after comparison of all the elements reported by the PageSpeed Insights tool for you to see the differences.

These results after all optimizations is better than I’d hoped on a first pass.

How Do I Summarize this Experience of Optimizing For Improved Page Speed Load Times

In a word, SiteGround!

Changing hosts was a very straightforward process. I contacted SiteGround through the chat service and over the phone to ask advice about a couple of minor things and I was amazed at how quickly and how thoroughly they responded.

Their support team so far has been very knowledgeable and professional and I wouldn’t hesitate to recommend them highly. This is not a flabby promotion to get a kickback on affiliate sales but a genuine recognition that the service they provide is excellent!

That’s it for now. Thanks for reading.

Paul

Please share your own experiences in the comments section below or feel free to ask me a question.