There’s always going to be a debate between this expert and that expert when it comes to solving your web page speed issues. Regardless of which side of the debate you are on, I think everyone can agree that they expect every website to load quickly.
Before Making an Incremental Improvement
Here’s a before screenshot where I highlighted the speed test result I performed on this site using GTmetrix.com which is one of the more popular speed testing sites.
It’s clear that the previous CSS grid layout was killing the PageSpeed Score. All the other metrics were above average. Before we break it down, here’s the second screenshot I took after uploading the new child theme.
After Making the Incremental Improvement
As the second screenshot shows, the new child theme was a drastic improvement over the old theme. Here’s a breakdown of the before and after scores.
- PageSpeed Score
- Before: D – 64%
- After: A – 96%
- YSlow Score
- Before: B – 88%
- After: B – 88%
- Fully Loaded Time
- Before: 2.1 seconds
- After: 1.7 seconds
- Total Page Size
- Before: 737 KB
- After: 245KB
- Before: 28 requests
- After: 27 requests
It was clear that images were the biggest offenders when it came to page speed. At first, Google suggested a few results on the first page that suggested A or B would solve the problem.
Guess what? None of these results solved the problem. After digging around the code and taking the time to understand what was happening, I scoured the Internet for a solution.
As it turned out, all I had to do was make a few minor adjustments to the PHP codes for the blog page.
Granted, I’m not 100% satisfied with the blog page layout yet. But incremental improvements is where you take your wins. Now that I know where to fix the code, I can easily tweak it as I go along.