Recently, a branding company that caters to CMOs asked Boomcycle to see if we could improve the speed of their WordPress website.
Generally, we undertake optimization projects as part of our overall package of SEO services. However, in this instance, the company founder expressed a desire for one thing only: dramatically increased page speed.
In spite of hosting their site on the venerable WP Engine, they had received feedback that their website was slow, and they had noticed it as well.
So, without delay, two of our web geniuses set out to prove that we could give this website great page speed performance.
To improve the page speed of this website, we thought we were going to implement proper caching and a few clever speed optimizations.
We didn’t realize we would bring to light decisions that would need to be addressed by the technical team and the CMO.
The Techie Background
Before we dive into what we did to optimize this website, a bit of background is necessary.
Core Web Vitals
Unless you’ve been sleeping under a rock for the past few months, you’ve probably heard from multiple sources that Google is rolling out algorithm changes “soon” based on their new Core Web Vitals metrics.
The Web Vitals initiative, which has been around since 2010, provides developers with tools they need in order to optimize their sites for high-performance. These include measures like page speed or mobile compatibility – both of which have become more important as we see users shift away from desktop computing devices towards smartphones and tablets.
In an attempt to allow webmasters to focus on the most vital aspects of Web Vitals, Google developed a set of Core Web Vitals, a simplified chart of metrics that matter the most.
In a nutshell, Core Web Vitals is Google’s view of how your site performs in the real world.
Core Web Vitals measures key aspects of the user experience, including load time for images and page speed over mobile networks.
A few difficult-to-memorize Core Web Vitals metrics follow:
LCP – Largest Contentful Paint
This metric is all about loading. LCP is the time that it takes to display the largest image or block of content viewable to a visitor. Less than 4 seconds is decent, and less than 2 seconds is probably going to get you a gold (green) medal from Google.
FID – First Input Delay
FID is about the time it takes until your website allows interactivity, such as scrolling or clicking a button. FID is primarily influenced by the amount of code that must load in order for your website to be useful to the visitor.
A good example of a large FID would be the time it takes to load all the images for one of those splashy home page slideshows.
Simply pick the best image and show that one, and you’ll get a green FID score!
CLS – Cumulative Layout Shift
CLS is that super-annoying thing where you try to click a button, but just before you do, the website or app “shifts”, and you end up clicking something you didn’t intend to, or missing your target completely. This is probably my “favorite” Core Web Vital, because I see it happen in real life every day.
CWV provides you with actionable information on what can be improved regardless of device or location.
PageSpeed Insights: Judge, Jury & Executioner
So how is a webmaster to judge their efforts as they pertain to CWV?
Fortunately, Google both invented Core Web Vitals, and gave us a tool to measure them: Google PageSpeed Insights.
PageSpeed Insights divides the scoring between Mobile and Desktop, measuring the performance on mobile devices and desktop devices, respectively.
The real-world difference between the two seems to be that Desktop scores are often fairly decent, while Mobile scores tend to be low-to-abysmal for most websites.
For example, when I measured Walmart.com using PageSpeed Insights on June 26, 2021, their desktop score was 88 out of 100, while their mobile score was 28 out of 100:
The statement below the score is most damning: “Over the previous 28-day collection period, field data shows that this page does not pass the Core Web Vitals assessment.”
You can measure any website on the internet using PageSpeed Insights. Try a few of your favorites and see how they rate. From what I’ve seen, generally speaking, the scores are pretty bad.
You might be reading this and thinking, “Well, if Walmart can’t do better than a 28/100 on mobile, then my website is doing fine at 31/100.”
But, Walmart is going to land on their feet. They have huge brand recognition. People search for “walmart” with the intent to do business at Walmart. Google loves branded searches.
Does your company have huge brand recognition? Or would you like to attract website visitors who searched for the products or services you provide, but didn’t know you existed?
Perhaps your CWV scores are so dreadful that Google pushes your site down to the 7th or 8th position, or worse yet, to the dreaded Page 2, where no one dares click.
Okay, back to our project.
The CWV scores on the website we intended to optimize were measured via PageSpeed Insights initially at 28/100 for mobile, and 63/100 on desktop. Not great.
A Core Web Vitals Optimization Project
For our project, a staging (testing) website was set up on WP Engine to give us free reign to make whatever changes we saw fit for testing purposes.
To summarize our findings: after some detailed optimizations (proper caching, deferring JS, minifying CSS and JS, elimination of unused portions of code and more) and the elimination of specific 3rd party scripts, we found that we could achieve scores between 95-100 on mobile and 100 on desktop.
So how did we get here?
The first thing you need to know when it comes to optimizations, is that while it’s your website being scored by Google, you are at the mercy of any and all 3rd-party scripts and analytics tags (tracking pixels, etc.) that you use.
These scripts are hosted on other servers whose performance you do not control.
Therefore, it is important to evaluate what you truly need on your website.
Ironically, even the code to implement Google Analytics is delivered from Google’s own servers and negatively impacts CWV scores!
Fortunately, there are some workarounds for certain problems like this. One speed-enhancing tweak is to host the code locally, a trick we sometimes use when we host the Google Analytics code on our own website.
The most impactful changes we made to increase the speed of this website turned out to be:
Note that the names have been changed here to protect the reputations of the companies involved. It is not our intention to slam any one particular purveyor of plugins; only to bring to light the problems associated with their use.
“Chatbot” is one of a tremendous number of chat plugin alternatives that attempt to take advantage of the on-demand nature of business communications: let me just ask this business my question right now. Contenders in the chat space include Drift, Freshchat, Zendesk Support Suite, Birdeye, Podium, Intercom…the list goes on.
A support inquiry to “Chatbot” returned with the answer that they don’t allow users to host their code on the user’s website. So we were out of luck with that trick.
“Email List Builder”is an email capture and list building tool to help site owners grow their blogs and businesses. Tools in the email list-building space include Sumo, OptinMonster, Hello Bar, Thrive Leads, LeadPages and more.
Both “Chatbot” and “Email List Builder”are worthy marketing tools that perform very important outreach and marketing functions. This site owner wanted these tools on his website.
But the use of these tools lowers our Google PageSpeed Insights scores.
Pick your poison.
The CMO Weighs In
The CMO and their marketing team is faced with a start decision:
We need to decide on a case-by-case basis whether a specific 3rd party script truly results in increased sales opportunities and revenue for the business.
Are there alternatives that might provide similar functionality without the Core Web Vitals cost?
The head of the Boomcycle Analytics team is a former employee of a Fortune 50 company. He tells terrifying tales of dozens of tracking pixels and analytics code snippets slowing down the websites of this behemoth to a crawl — all so the marketing team(s) can measure the effectiveness of their advertising campaigns!
Here’s the output of ObservePoint, which shows all tracking codes in a major brand website:
An interesting note is that the two biggest offenders on this particular website are Google Ads Remarketing trackers, adding nearly a full second of page load time.
No surprise then that this brand’s PageSpeed scores are among the lowest I’ve ever seen at 14/100, and a Time to Interactive of 31.2 seconds!
The irony is, measuring the experience of visitors is slowing the site down to the point that they are likely losing a big chunk of potential customers.
Studies conducted by Amazon in 2016 showed a 10% visitor loss for every additional second of page loading time (to put a more positive spin on it, revenue increased by 10% for every second of page speed improvement).
Walmart’s own data showed that visitors were twice as likely to convert when page speed was between 1-2 seconds vs. 3-4 seconds.
Website visitors are notoriously impatient.
Spoiler Alert: The Key Takeaway of This Article
Some CMOs and those in marketing may consider their webmasters, SEOs and SEM practitioners as operating in a walled garden, apart from the concerns of marketing.
But in order for a business to function effectively on the web, these two disciplines must work together.
A CMO needs to look at marketing best-practices, their website visitor’s experience, and Google’s interest in their website — if they care about being visible on Google.
The goal is to balance visitor experience with marketing objectives.
Without further ado, let’s get on to the real-world test!
WordPress Website Speed Optimizations
For our tests, we examined the results of each change that was made using both Google Page Speed Insights, as well as the well-respected GTmetrix.
As you’ll see, GTmetrix almost always gives more encouraging results than PSI, and often gives some insightful and actionable data for improvements. Their waterfall chart is especially helpful.
For our analysis, we started by proving we can achieve excellent PSI numbers.
We then demonstrated how the numbers fall as we add in the “problem children” until site speed and CWV metrics become poor again.
Following are the details of our analysis.
Begin at the End: Proof of Speed
To achieve these, well, perfect scores, we performed a variety of on-page optimizations including image resizing/optimizing, proper caching, deferring JS, minifying CSS and JS, elimination of unused portions of code and more.
In addition, the on-load of the Homepage slider image was delayed as it added considerable weight on Largest Contentful Paint (LCP), one of the key Core Web Vital metrics.
Several additional potential optimizations could not be accomplished due to problems logging into the WP Engine filesystem.
And as previously stated, the “Chatbot” and “Email List Builder” plugins were disabled.
The same optimizations also managed to score 100% on GTMetrix:
In addition, all the Core Web Vitals were green and the site fully loaded in less than 1 second.
De-Optimizing: Homepage slider image
Adding back in a slider widget made the whole website load more slowly:
Google PageSpeed Insights
As you can see, the mobile experience is drastically affected, with a 21% reduction in overall performance.
Seemed like an easy “win” to simply replace the slider with a standard image.
This is how the site performed in GTMetrix with the slider enabled — still pretty nice scores:
As you can see, all the Web Vitals are green. Site fully loads in 1.2 seconds.
We then tested the site after enabling “Chatbot”:
Google PageSpeed Insights
Once “Chatbot” was enabled, the Mobile performance score fell from 79 to 29. The largest single hit of anything we optimized was to remove this chat widget.
The Desktop performance went down as well; from 96 to 75.
Enabling “Chatbot” causes a large performance and CWV hit.
Here are the “Chatbot”-enabled scores in GTmetrix:
A GTmetrix “B” is not terrible, but the Google PageSpeed Insights are more telling.
Performance and Structure numbers are reduced from 95 to 88 and 99 to 88. Also, LCP has been increased from 1.2 seconds to 1.4 seconds.
The fully loaded time has increased dramatically, from 1.2 seconds to almost 8 seconds.
“Chatbot” Disabled- “Email List Builder” Enabled
For this test, “Chatbot” was turned off and “Email List Builder” was enabled:
Google PageSpeed Insights
With “Email List Builder” enabled and “Chatbot” turned off, Google PageSpeed Insights mobile score shows a bit of improvement. However, the overall number is still below-par.
On Desktop, there wasn’t a huge difference:
With “Chatbot” turned off and “Email List Builder” on, we scored a ‘B’ and our Performance and Structure scores are the same as with “Chatbot” turned on. Turning “Email List Builder” on has no huge impact on these numbers, but the fully loaded time is 2.7 seconds.
When “Chatbot” was on, this was almost 8 seconds.
It appears that “Chatbot” has a huge impact on the fully loaded time of the site.
The Somewhat Sad, Current (Initial) State of the Website
In this test, all the plugins currently used on the live website were turned on and all our other optimizations were removed.
Google PageSpeed Insights
This is how the website performs on Google PageInsights test for Mobile:
…and this is how it performs on Desktop:
These are the lowest recorded numbers.
We scored a “B” on GTMetrix and fully loaded time is again nearly 8 seconds. Both LCP and Total Blocking Time (TBT) increased.
Conclusions From Testing
As you can see from our test results, this website needed optimizations.
The client needed to see the results of our optimizations, in order to appreciate the landscape of decisions that needed to be made.
It’s actually fairly simple to optimize websites to go fast.
The hard part is deciding which group in the company to disappoint! Should the website offer a poor visitor experience? Or should their favorite widget or tracking pixel no longer fire?
Do Try This At Home!
You can always check your own scores by visiting Google PageSpeed Insights and GTMetrix.
Be sure when you test a website, that you click the little “Desktop” tab to check those scores so you don’t feel too sad.
Of course, you can always check your competitor’s websites in these tools as well to see how they may be dealing with Core Web Vitals and visitor experience.
Just pop in your website, as well as the website(s) of your toughest business rivals, and see how your company stacks up against the competition.