---
title: "Ecommerce Core Web Vitals: Fix LCP, CLS, and INP"
description: "Ecommerce Core Web Vitals fail in predictable ways: product images, unsized tiles, variant pickers, and tag bloat. How I fix them template by template."
image: "https://cdn.blackseoanalyzer.com/blog-images/ecommerce-seo-fix-core-web-vitals-now.jpg"
canonical: "https://www.blackseoanalyzer.com/en/blog/ecommerce-seo-fix-core-web-vitals-now"
language: "en"
---

# Ecommerce Core Web Vitals: Fix LCP, CLS, and INP Across Your Catalog

By [Seth Black](https://www.blackseoanalyzer.com/en/about) · Published September 16, 2026

![Ecommerce Core Web Vitals: Fix LCP, CLS, and INP Across Your Catalog](https://cdn.blackseoanalyzer.com/blog-images/ecommerce-seo-fix-core-web-vitals-now.jpg)

Ecommerce sites fail Core Web Vitals in ways that are almost predictable. The templates are heavy, marketing keeps adding pixels, and someone built the hero carousel in JavaScript three years ago and nobody wants to touch it. Meanwhile your product pages lose ground to a competitor running a plain theme with no third-party junk.

Here’s how I work through Core Web Vitals on a real catalog, instead of staring at Search Console’s aggregate buckets for a month.

## Start with field data, grouped by template

Search Console’s Core Web Vitals report groups similar URLs, and CrUX gives you real-user numbers. Use both to answer one question first: which templates are failing, and on which metric?

On a store, that usually means product detail pages (PDPs), product listing and category pages (PLPs), cart, and checkout. Each fails differently. A catalog with 40,000 SKUs might have a dozen template variants, and they don’t break the same way. The out-of-stock template can be slower than the in-stock one. The sale category page has a banner that tanks CLS. Three sample URLs won’t show you that.

For the element-level debugging workflow once you’ve picked a template, see [how to diagnose Core Web Vitals failures at the page level](https://www.blackseoanalyzer.com/en/blog/how-to-diagnose-core-web-vitals-failures-at-the-page-level).

## LCP on the product detail page

The PDP is where the money lives, and it’s where LCP usually breaks. On most PDPs I’ve audited, the LCP element is the main product image, held back by one of a few things: a render-blocking script in the head, font loading that competes with the image, lazy-loading on the image that should load first, or a multi-megabyte PNG someone uploaded straight from a vendor.

The fix is unglamorous:

- Preload the main product image with one `<link rel="preload">` tag, or give it `fetchpriority="high"`.
- Don’t lazy-load it. Lazy-load everything below the fold instead.
- Serve WebP or AVIF, sized for the viewport, with a real `srcset`.
- Defer the personalization or recommendation script that’s blocking render.
- Stop loading six font weights when the design uses two.

If the LCP image sits inside a JavaScript carousel, the page may not paint it until the carousel library initializes. Server-render the first slide as a plain `<img>` and let the carousel take over after.

## CLS on listing pages is usually images and late content

PLPs shift because product tile images don’t have dimensions, prices or badges load after a fetch, or a promo banner appears after first paint.

- Set explicit `width` and `height`, or an `aspect-ratio`, on every product card image.
- Reserve space for price, rating, and add-to-cart so they don’t push the grid down when they hydrate.
- If an A/B testing tool injects a banner above the fold, that banner is your CLS problem. Reserve a slot for it or remove it.

I’ve seen stores fix most of their listing-page CLS with nothing more than image dimensions on product tiles. Check that first.

## INP: filters, variant pickers, and add to cart

Interaction to Next Paint on ecommerce usually fails on the interactions shoppers use most: opening a filter panel, choosing a size or color, and adding to cart. When a variant click re-renders the whole product page, or a filter change blocks the main thread while a big bundle recalculates, INP suffers.

Record those interactions in DevTools’ Performance panel on a throttled CPU. Look for long tasks right after the click. Common fixes: update only the parts of the page that change, break up long tasks, and move analytics calls out of the click handler.

## The tag manager is usually the real problem

The damage on most ecommerce sites lives in the tag manager. Several analytics tools, a couple of personalization scripts, a chat widget, a reviews widget, and a recently-viewed carousel that re-renders on every page. Each one was approved on its own. Nobody approved the total.

Open the Coverage tab in DevTools on a PDP and see how much loaded JavaScript actually runs during page load. Then list every third-party script with its owner. Scripts without an owner are the first candidates to remove. Scripts with an owner can usually load after the page is interactive.

## Check every template, not three URLs

Field data tells you which templates fail. A crawl tells you why, on every URL. I run the catalog through Black SEO Analyzer with rendering on, and its web vitals checks flag the causes page by page next to everything else: images without dimensions, an LCP image with no preload, render-blocking and synchronous scripts, heavy third-party scripts, and total JavaScript weight. Group those by template and you have a fix list that maps to specific components, instead of a score.

Then fix one template at a time, starting with the PDP, and watch the field data over the next 28 days. Lab numbers move the same day. Search Console takes longer.

Want to find the Core Web Vitals causes across your whole catalog? [Try BSA free for 14 days](https://www.blackseoanalyzer.com/free-trial), every feature, no page limit, no credit card.

-Sethers

About the author

[Seth Black](https://www.blackseoanalyzer.com/en/about)

Seth is a software engineer and engineering leader who builds bseoa, a Rust-based technical SEO crawler with a GUI and CLI. He writes about the crawling, rendering and indexing problems he runs into on real sites.

[LinkedIn](https://www.linkedin.com/in/seth-black-tx/) · [GitHub](https://github.com/sethblack) · [YouTube](https://www.youtube.com/@SethBlack)

[Back to Blog](https://www.blackseoanalyzer.com/en/blog)

## Discover hundreds of SEO Issues in Seconds

Without Monthly Subscriptions

Comprehensive technical SEO analysis powered by ML and 16 specialized modules. Optional AI-powered insights from Claude, GPT-4, or Gemini. Get actionable insights in seconds, and never pay monthly fees again.

[Download Free Trial](https://www.blackseoanalyzer.com/en/free-trial)

I use AI to generate images for my posts and for general editing, updates, and ironically SEO purposes. I used to draw all of the images for my personal blog (taleas) myself, but as the volume of content I produce has increased, I've turned to AI tools to help create visuals that complement my writing. I go out of my way to generate images that look strange, and don't represent real people. If you ever want to chat about my use of AI, please reach out.

```json
{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://www.blackseoanalyzer.com/#organization","name":"Fiscus Technology, LLC","url":"https://www.blackseoanalyzer.com/","logo":{"@type":"ImageObject","url":"https://www.blackseoanalyzer.com/static/images/black-seo-analyzer.png"},"sameAs":["https://sethserver.com/","https://github.com/sethblack"],"founder":{"@id":"https://www.blackseoanalyzer.com/#seth"}},{"@type":"WebSite","@id":"https://www.blackseoanalyzer.com/#website","name":"bseoa","url":"https://www.blackseoanalyzer.com/","publisher":{"@id":"https://www.blackseoanalyzer.com/#organization"}},{"@type":"Person","@id":"https://www.blackseoanalyzer.com/#seth","name":"Seth Black","url":"https://www.blackseoanalyzer.com/about","jobTitle":"Creator of bseoa","sameAs":["https://www.linkedin.com/in/seth-black-tx/","https://github.com/sethblack","https://www.youtube.com/@SethBlack","https://sethserver.com/"]},{"@type":"BlogPosting","@id":"https://www.blackseoanalyzer.com/en/blog/ecommerce-seo-fix-core-web-vitals-now#article","headline":"Ecommerce Core Web Vitals: Fix LCP, CLS, and INP Across Your Catalog","name":"Ecommerce Core Web Vitals: Fix LCP, CLS, and INP Across Your Catalog","description":"Ecommerce Core Web Vitals fail in predictable ways: product images, unsized tiles, variant pickers, and tag bloat. How I fix them template by template.","url":"https://www.blackseoanalyzer.com/en/blog/ecommerce-seo-fix-core-web-vitals-now","datePublished":"2026-09-16T01:35:42","dateModified":"2026-09-16T01:35:42","author":{"@id":"https://www.blackseoanalyzer.com/#seth"},"publisher":{"@id":"https://www.blackseoanalyzer.com/#organization"},"image":{"@type":"ImageObject","url":"https://cdn.blackseoanalyzer.com/blog-images/ecommerce-seo-fix-core-web-vitals-now.jpg","width":1200,"height":630},"mainEntityOfPage":{"@type":"WebPage","@id":"https://www.blackseoanalyzer.com/en/blog/ecommerce-seo-fix-core-web-vitals-now"},"isPartOf":{"@id":"https://www.blackseoanalyzer.com/#website"},"inLanguage":"en-US","isAccessibleForFree":true,"wordCount":843},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://www.blackseoanalyzer.com/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https://www.blackseoanalyzer.com/en/blog"},{"@type":"ListItem","position":3,"name":"Ecommerce Core Web Vitals: Fix LCP, CLS, and INP Across Your Catalog","item":"https://www.blackseoanalyzer.com/en/blog/ecommerce-seo-fix-core-web-vitals-now"}]}]}
```
