You open your store on your laptop and it feels fine. Then you run it through PageSpeed Insights and the mobile score is red. Both are true at the same time, and the mobile number is the one that matters, because most of your shoppers are on phones and Google uses the mobile experience to judge your site.
This guide explains why mobile is so much worse, how to find the real cause on your own store in about ten minutes, and which fixes actually move the number.
What I see in real sites
During pre-sales reviews I run Lighthouse on a prospect’s site before I say anything about their problem. Across the ten sites where I kept those numbers (mostly WordPress, several WooCommerce, one on a different platform), nine had the same shape:
- Desktop Largest Contentful Paint (LCP) was mostly between 0.7 and 2 seconds. That is good.
- Mobile LCP was mostly between 3 and 9 seconds. Google’s “good” line is 2.5 seconds.
- The gap was commonly 3 to 9 times between the two, and in one severe case the mobile homepage was 27 seconds against 4.8 on desktop.
It is a small sample, not a study, but it matches what most performance work on WordPress runs into: the site was tuned, or at least tested, on desktop, and nobody looked at mobile.
Why mobile is so much worse
LCP measures how long it takes for the biggest visible thing above the fold, usually a hero image or a heading, to appear. Three things make that slower on mobile.
1. The test is harsher, on purpose. Lighthouse’s mobile mode simulates a slow 4G connection and a CPU that is about four times slower than a typical laptop. Your laptop on office Wi-Fi is not what it is measuring. That is deliberate, because it approximates a mid-range phone on a mediocre connection.
2. The phone is often downloading a desktop-sized image. If a theme, page builder, or slider outputs one big hero image without correct responsive sizes, a phone downloads the same multi-hundred-kilobyte file a widescreen monitor would, then shrinks it. On a slow connection that download is the LCP.
3. Everything competes for a weaker CPU. Scripts from your theme, slider, chat widget, analytics, and marketing plugins all run on that slower processor. The browser cannot paint your hero until it has dealt with the render-blocking CSS and JavaScript ahead of it.
There is also a difference between lab data and field data. Lighthouse is a lab simulation. The “Discover what your real users are experiencing” section at the top of PageSpeed Insights shows field data from real Chrome users, and that is closer to what Google actually uses. Look at both.
Find the real cause in ten minutes
Do not start by installing an optimization plugin. Find out what your LCP element is and where the time goes.
- Open PageSpeed Insights, enter a page that matters (the homepage, a product page, a category page), and choose the Mobile tab.
- Scroll to the diagnostics and open Largest Contentful Paint element. It tells you exactly what the element is. Usually it is an image, sometimes a heading or a block of text.
- Look at the LCP breakdown, which splits the time into four parts: time to first byte, resource load delay, resource load duration, and element render delay. The biggest part is where your problem lives.
| Biggest part | What it usually means |
|---|---|
| Time to first byte | Slow hosting or no page cache. The server is slow before the browser can do anything. |
| Resource load delay | The browser found the image late. It is lazy-loaded, set as a CSS background, or added by JavaScript. |
| Resource load duration | The image is too large for a phone, or the wrong format. |
| Element render delay | Render-blocking CSS or JavaScript, or a slow font, is holding the paint. |
- Repeat on two or three other page types. Product pages and the homepage often have different causes.
The fixes that move the number
Match the fix to the part that was biggest.
If it is time to first byte: make sure a real page cache is serving your public pages, and that your cache rules exclude cart, checkout, and account pages so they still work correctly. If the first byte is slow even with caching, the problem is hosting or a heavy database, and that needs a different conversation.
If it is resource load delay:
- Do not lazy-load the LCP image. Lazy-loading is right for images below the fold and wrong for the hero. Recent WordPress versions try to avoid lazy-loading the first image, but themes, sliders, and page builders often override that.
- Make sure the image is a real
imgtag in the page HTML, not a CSS background or something a script adds later, so the browser can discover it early. - Give the LCP image
fetchpriority="high"so the browser fetches it first.
If it is resource load duration:
- Serve an appropriately sized image to phones. Check that the
srcsetandsizesattributes are sensible, and that a 400px-wide slot is not receiving a 2000px-wide file. - Use a modern format like WebP or AVIF, and compress properly. Big hero photos are the single most common culprit.
- Consider a static image instead of a slider or video for the first screen. Sliders and background videos are expensive on mobile.
If it is element render delay:
- Find scripts and styles that block rendering, and defer or remove what is not needed. Unused plugin assets loading on every page are a very common cause on WooCommerce sites.
- Load only the fonts you need, and use
font-display: swapso text can appear before a custom font finishes loading. - Be careful with “combine and minify everything” settings. They sometimes make things faster and sometimes break checkout, so test after each change.
Things that waste time
- Chasing the overall score. A green score with a poor LCP on your key page is still a poor experience. Fix the specific metric on the pages that make money.
- Stacking optimization plugins. Two or three overlapping caching and optimization plugins often make things slower and harder to debug.
- Testing only the homepage. Product and category pages have different LCP elements and different problems.
- Testing only on desktop. That is how the gap goes unnoticed in the first place.
After you fix it
Re-run PageSpeed Insights on the same pages. Lab numbers change immediately, but the field data takes weeks to update because it is a rolling window of real visits. Do not be discouraged if the field numbers lag behind. Check Google Search Console’s Core Web Vitals report over the following month.
When it is not a quick fix
Sometimes the cause is the theme itself, a page builder that outputs heavy markup, or a plugin that loads a lot of script on every page. Those fixes take real development work, and they are easy to get wrong on a store that is taking orders.
If you would rather have the cause written down than hunt for it yourself, the WooCommerce Store Audit checks mobile and desktop performance along with security headers, checkout, shipping, tax, and plugin conflicts, and delivers a prioritized written report. It is a flat fee, and it is credited toward the fix work if you decide to hire me for it.