Shopify LCP: What It Costs and How to Fix It

Shopify Page Speed: How We Reduced LCP from 18 Seconds to Under 700ms

A store came to us with an LCP of 18.6 seconds. Not 1.8. Not 8. Eighteen point six seconds before the page's main element loaded on mobile.

They were running Meta ads to this store. Every campaign, every click, was landing buyers on a page that took nearly 19 seconds to look like anything. Most left within three. The traffic numbers looked fine. The conversion rate was 0.3%.

After the audit and implementation: LCP dropped to 695ms. Lighthouse score went from 53 to 82-86. Same ad budget. More of it reaching people who actually saw the store.

That outcome isn't exceptional -- it's what happens when you find the real causes of a slow Shopify store and fix them in the right order. This post walks through what we found, what we changed, and what the results showed. More importantly, it covers the causes that slow down most Shopify stores -- and the single mistake that 59% of stores are making right now without knowing it.

---

What LCP Is and Why It's the Metric That Matters Most

LCP stands for Largest Contentful Paint. It measures how long it takes for the largest visible element on a page -- usually the hero image or main heading -- to load and paint on screen.

From the user's perspective: LCP is the moment the page looks like it's actually working. Before LCP, they see a blank screen or a loading skeleton. After LCP, they see the store.

Google's LCP thresholds:

| Score | LCP time |

|-------|----------|

| Good | Under 2.5 seconds |

| Needs Improvement | 2.5 -- 4.0 seconds |

| Poor | Over 4.0 seconds |

LCP is one of three Core Web Vitals that Google uses as ranking signals:

• LCP -- largest visible element load time
• INP (Interaction to Next Paint) -- how quickly the page responds to user actions (replaced FID in March 2025)
• CLS (Cumulative Layout Shift) -- whether elements move around as the page loads

All three matter for SEO and user experience. LCP matters most for initial impressions -- and for the revenue math that follows.

---

What Slow LCP Costs in Real Money

The performance-revenue relationship is documented across hundreds of studies. The headline numbers:

• 1-second LCP delay = 7% conversion rate drop (consistent across multiple studies)
• 100ms delay = 1% revenue loss (Google/Deloitte)
• LCP at 4 seconds vs. 2 seconds = 40-50% lower CVR on product pages

Run the math on a real store:

A store doing $100,000/month in revenue with 100,000 monthly sessions. If LCP improves by just one second:

• 7% conversion lift on 100,000 sessions = approximately 700 additional conversions/month
• At $60 AOV: $42,000/month additional revenue
• Annual impact: $504,000

Even a conservative estimate -- 1% improvement at lower traffic -- still produces $84,000 in annual revenue from a single metric fix.

This is why a $199 speed audit pays for itself before the implementation begins.

The mobile multiplier makes it more urgent. Over 60% of Google searches now happen on mobile. Google uses mobile scores as primary ranking signals, including for desktop results. 53% of mobile users abandon sites that take more than 3 seconds to load. If your LCP is failing on mobile -- and most stores' worst scores are on mobile -- you're losing more than half your traffic before they see anything.

---

What We Found on the 18.6-Second Store

When we ran the full audit, the causes stacked predictably. No single thing caused 18.6 seconds -- it was a combination that compounds.

Primary cause: the hero image was lazy-loaded.

This is the single most common LCP mistake on Shopify stores -- and the one with the biggest impact. Lazy loading is a technique designed to defer loading of images that are off-screen, improving initial page performance. Applied to the hero image, it backfires completely.

When the hero image is lazy-loaded, the browser doesn't request it until it finishes parsing the DOM. On a real device on a real connection, that delay is 3-8 seconds before the image request even begins. Add the actual download time on top of that, and you have an LCP that looks catastrophic.

This store's 2,800px banner image had loading="lazy" applied in the theme code. One attribute change -- loading="eager" plus fetchpriority="high" -- cut several seconds off LCP immediately.

Second cause: 11 app scripts loading on every page.

Eleven separate apps with JavaScript loading globally, regardless of whether the page needed them. A review app loading on the homepage. A loyalty widget loading on the blog. A subscription popup loading on the size guide.

Each script adds HTTP requests, parsing time, and main thread work. At 11 scripts, the browser is executing hundreds of kilobytes of third-party JavaScript before it can render anything above the fold.

The fix: disable global loading for every app that didn't need to load on every page. Six of the eleven apps had settings to restrict loading to specific page types. Three could be deferred to load after the LCP event. Two were apps from plugins the store had stopped using -- their scripts remained in the theme code after uninstallation.

Third cause: a 2.4MB hero image.

Shopify's CDN resizes images on request -- but only if the theme code requests the appropriate size. The theme was calling for the full 2,800px image to display in an 800px container. The browser downloaded 2.4MB, then rendered it at 800px.

WebP conversion and correct responsive sizing brought this image to under 180KB at display size -- a 13x reduction in file size.

Supporting causes: Custom fonts loading synchronously without preloading. A tag manager loading several third-party pixels before any page content rendered. Missing resource hints for critical above-fold assets.

Combined effect before fixes: 18.6s LCP, Lighthouse 53.

Combined effect after fixes: 695ms LCP, Lighthouse 82-86.

---

The 6 Most Common Shopify LCP Causes

The store above is an extreme case. But the underlying causes show up in almost every Shopify store with a slow LCP. Here are the six, ranked by frequency:

1. Lazy-loading the LCP image

59% of Shopify pages lazy-load their hero image. This is wrong. Lazy loading is for below-fold images only.

Fix: In Shopify Liquid, use loading: 'eager' for hero and banner images. Add fetchpriority="high" to the image tag. For themes using Shopify's image_tag filter, use preload: true to send a Link: rel=preload HTTP header before HTML parsing starts. This is a 5-minute theme edit with significant LCP impact.

2. App script accumulation

Every installed app loads JavaScript. Most load it on every page by default. Stores that have tested, added, and partially removed apps over 1-2 years often carry scripts from 8-15 apps on every page load.

A Shero Commerce benchmark study of 1,000 Shopify stores found: stores with 8+ third-party app scripts had median mobile LCP above 3.0s. Stores with 3 or fewer had median LCP under 2.0s. The theme matters; the apps determine the real-world score.

Fix: Audit which apps actually need to load on which pages. Restrict script loading to relevant page types where app settings allow. Remove leftover scripts from uninstalled apps in theme.liquid and app embed settings.

3. Unoptimized hero images

Shopify's CDN will resize images on request -- but only if the theme code requests the right size. A 2,500px image in an 800px display container downloads at full size, then scales in the browser. WebP format is 25-35% smaller than JPEG at equivalent visual quality -- and Shopify serves WebP natively to supporting browsers.

Fix: Use responsive image markup with srcset and sizes. Compress images before uploading. Request appropriately-sized images from Shopify's CDN using URL size parameters (_800x.jpg, _1200x.jpg).

4. Custom fonts blocking render

Custom fonts that aren't preloaded add a render-blocking request before any above-fold content displays.

Fix: Preload primary fonts in with . Use WOFF2 format. Consider system font fallbacks for body text where brand identity doesn't require custom fonts.

5. Ghost scripts from uninstalled apps

Shopify doesn't automatically remove app code from themes when apps are uninstalled. Script tags, CSS links, and app embed blocks remain in theme code indefinitely unless manually removed.

Fix: After uninstalling an app, check theme.liquid for leftover script and CSS references. Go to Admin > Online Store > Customize > App embeds and disable any apps that are no longer installed.

6. Missing fetchpriority signal

The fetchpriority="high" attribute tells the browser to deprioritize other requests and load this resource first. Without it, the browser guesses at prioritization -- often incorrectly.

Fix: Add fetchpriority="high" to the LCP image element. This is a single-attribute change with measurable LCP improvement, particularly on pages with many competing resources.

---

INP: The Metric Most Shopify Stores Are Ignoring

In March 2025, Google replaced First Input Delay (FID) with Interaction to Next Paint (INP) as a Core Web Vital.

The difference matters: FID measured only the first user interaction. INP measures every interaction during the entire session -- every click, every tap, every form input, every add-to-cart.

A store can have a fast LCP and still fail INP. If the add-to-cart button takes 400ms to respond because a review app is executing a long JavaScript task when the user taps it -- that's an INP failure. And it's invisible to merchants who haven't updated their testing workflow since FID was deprecated.

INP threshold: Good = under 200ms. Poor = over 500ms.

Shopify's platform-wide median INP is 153ms -- passing. But heavily app-loaded stores frequently fail. The root cause is JavaScript-heavy apps executing long tasks that block the browser's main thread, delaying its ability to respond to user input.

Sarah runs a beauty brand. Her LCP was 1.9 seconds -- well within Good. Her INP was 680ms -- deep in Poor. The culprit was a loyalty and rewards app executing a 340ms JavaScript task on every page interaction. Users would tap "add to cart" and see nothing happen for nearly three-quarters of a second. Her add-to-cart rate was 11% below category benchmarks. The problem wasn't loading speed -- it was responsiveness. Once the app's loading was deferred until after first user interaction, her INP dropped to 180ms.

---

Core Web Vitals as an SEO Signal in 2026

The nuanced reality: CWV is a tiebreaker, not a trump card. When two pages have comparable content quality, relevance, and authority, Core Web Vitals determine which ranks higher.

The March 2026 Google core update strengthened performance signals. Sites with consistently poor CWV on mobile face measurable ranking suppression -- particularly in competitive categories where the top 5 results all have reasonable content quality.

The practical compound effect: fixing LCP pulls two revenue levers at once.

• Conversion lift: Better UX on the same traffic = more orders
• Ranking uplift: Better CWV = higher organic positions = more traffic

An ecommerce platform that improved LCP from 4.1s to 2.2s reported +28% organic traffic alongside +15% revenue. Both moved together because both respond to the same fix.

Only 48% of Shopify stores pass all three Core Web Vitals on mobile. For stores in competitive categories, that means roughly half of your competitors are handing you a ranking advantage if you fix what they haven't.

---

---

What the Numbers Actually Mean

18.6 seconds isn't just a bad score. It's a store where more than 90% of visitors left before seeing anything -- every ad dollar spent to get them there, wasted.

695ms is a page that loads before most users notice it loaded.

The causes that produced the 18.6-second LCP are not unusual. They're a slightly worse version of what we see on stores with 4-second LCPs. The lazy-loaded hero, the accumulated app scripts, the oversized images -- these are standard Shopify entropy. Stores that start clean gradually accumulate them.

The audit identifies exactly which combination is producing the score on your specific store. The implementation fixes them. The result isn't a one-time improvement -- it's a baseline that makes every other traffic acquisition effort work harder.

If you want to know exactly what's slowing down your store, our Speed & Performance Audit covers Core Web Vitals analysis, LCP diagnosis, app bloat identification, and a prioritized fix list. Delivered in 48 hours, $199. The store above got the audit and implementation as part of a Store Health Audit, which covers speed alongside conversion flow and technical SEO.

Your store is probably not at 18.6 seconds. But if it's over 3 seconds on mobile -- and statistically, there's more than a 50% chance it is -- the revenue math above applies to you.