While building this blog I got curious about its speed, so I measured our own site. The result was a little funny. On desktop the homepage painted in about half a second, and yet one clear problem stood out. So here is the walk-through, using our own site as the example: where to actually start with WordPress speed.
The yardstick: Core Web Vitals
Google grades page speed with three metrics, together called Core Web Vitals.
| Metric | What it measures | Good |
|---|---|---|
| LCP | Time for the largest element to appear | Under 2.5s |
| INP | How fast the page responds to a tap or click | Under 200ms |
| CLS | How much the layout shifts while loading | Under 0.1 |
The catch is that Google measures these on mobile and slower connections, at the 75th percentile of what real visitors experience, not on your fast desktop. A page that feels quick on your own machine can still fail.
What I found on our site
First, the good news. Layout stability came in at 0.003, which is close to perfect. Every image has its width and height set, so nothing jumps around as the page loads. The theme is light too: GeneratePress ships only about 20 KB of CSS and 7 KB of JavaScript.
The problem was images. A single page weighed about 2.8 MB, and roughly 95% of that was images, all of them un-optimized PNG. The homepage alone loaded three PNGs between 800 and 950 KB each. It looked fast on desktop only because my connection was fast; on a slow phone that weight drags the whole thing down. There was also no page-cache plugin yet.
So where do you start?
1. Images first (the biggest win)
Convert PNG and JPG files to modern formats like WebP or AVIF, which keep similar quality at a fraction of the size. Do not upload a full-resolution original larger than it will ever display; size it down. Lazy-load images below the fold so they load only when needed. There is one exception: never lazy-load the largest image in the first screen. That one should load early, even with a high fetch priority.
2. A caching plugin
Instead of rebuilding the page with PHP on every visit, a cache stores the finished HTML and serves that. WP Super Cache, W3 Total Cache, and LiteSpeed Cache are common free options. The busier your site gets, the more this helps.
3. Drop the assets you do not use
Plugins often load their own CSS and JavaScript on every page. A contact-form plugin, for instance, adds its scripts even to posts with no form. Dequeue those where they are not used and the page gets lighter.
4. Go easy on themes and plugins
More plugins mean more files to load and more database queries. Keep only what you actually need, and pick a light theme to begin with.
5. Hosting, CDN, and the database
If the server is slow to respond, no amount of front-end tuning fully makes up for it. Good hosting, a current PHP version, and a CDN that serves files from a location near your visitors all help. Cleaning out old revisions and leftover data now and then is worth doing too.
The takeaway
Speed is about being fast on a slow phone, not on your desktop. Our own site looked fine on desktop, but the real issue was image weight. If you want an order to work in: images first, then caching, then trimming assets you do not use. We are going to start with the images ourselves. One honest note: this was measured once in a desktop browser, so it is not the same as Google’s official mobile score.