> ## Documentation Index > Fetch the complete documentation index at: https://docs.vortexiq.ai/llms.txt > Use this file to discover all available pages before exploring further. # LCP by Template, Website Performance (PageSpeed + CrUX) > LCP by Template for Website Performance (PageSpeed + CrUX) stores. Tracked live in Vortex IQ Nerve Centre. How to read it, why it matters, and how to act o... **Metrics type:** [Supporting Metrics](/nerve-centre/overview#metrics-types-explained) • **Category:** [Website Performance](/nerve-centre/connectors#connectors-by-type) ## At a glance > **LCP broken down by page template**, surfaces which templates have the worst load speed. **Most ecommerce LCP issues concentrate on a small set of templates** (homepage hero, PDP hero, collection grid first-image), so the per-template view directly identifies the optimisation focus. Pairs with [`psi_score_by_template`](/nerve-centre/kpi-cards/website-performance/score-by-template) for the full picture; this card decomposes the LCP sub-metric specifically. | | | | ------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | **What it counts** | Lab LCP measurement for each template's representative URL. Reported per template with traffic share weighting. Mobile profile by default. | | **Sample type** | **Lab data** from per-template Lighthouse audits. Field equivalent: [`crux_lcp_p75`](/nerve-centre/kpi-cards/website-performance/page-load-speed) at origin level (per-URL field via [`psi_slowest_lcp_urls`](/nerve-centre/kpi-cards/website-performance/slowest-lcp-urls)). | | **Why per-template LCP matters** | LCP varies dramatically by template type. Homepage carousels select different LCP elements than PDP product images than collection grid first-images. **Each template's LCP traces to a specific element**, and template-level fixes ship to many URLs at once. | | **Common per-template LCP patterns** | (1) **Homepage**: hero carousel image (large, often unoptimised). (2) **PDP**: product hero image (variable per product). (3) **Collection**: first product image in the grid. (4) **Cart, checkout**: lighter pages, faster LCP, usually no work needed. (5) **Search**: first result's image, similar to collection pattern. | | **Reading the per-template view** | Sort by LCP × traffic share. Identify which template carries the worst LCP × highest traffic. **Apply template-level image fix-pattern**: responsive variants, format conversion, preload. One fix lifts all URLs in the template. | | **Currency** | n/a, milliseconds per template. | | **Time window** | `T/7D` | | **Alert trigger** | `worst-template LCP > 4,000ms` (poor band on dominant template). | | **Sentiment key** | `psi_lcp` | | **Roles** | owner, marketing, operations | ## Calculation Calculated automatically from your Website Performance (PageSpeed + CrUX) data. See the At a glance summary above for what the metric tracks and the worked example below for a typical reading. ## Worked example A UK-based BigCommerce fashion store, per-template LCP Wednesday 15 May 26. | Template | Mobile LCP | Traffic share | LCP × traffic | LCP element | Fix pattern | | ------------------- | ---------: | ------------: | ------------: | --------------------------------- | ---------------------------------- | | Homepage | 4,820ms | 22% | **1,060** | Hero PNG carousel slide 1 (2.8MB) | Format + responsive variants | | Collection page | 4,610ms | 28% | **1,290** | First product image in 12-grid | Lazy-load grid + format conversion | | Product detail page | 3,640ms | 25% | **910** | Product hero image (1.6MB JPEG) | Format conversion + preload | | Search results | 4,200ms | 8% | 336 | First result image | Same as collection | | Cart | 2,180ms | 8% | 174 | (light page, no media drag) | None | | Checkout step 1 | 1,940ms | 4% | 78 | (lightest) | None | | About / contact | 3,420ms | 1% | 34 | Banner image | Low priority | What the per-template view is telling us: 1. **Collection page (1,290) tops the priority ranking.** 4,610ms LCP × 28% traffic share = highest commercial impact. The first product image in the 12-grid is the LCP element; lazy-loading images 5-12 + format conversion drops the metric significantly. 2. **Homepage (1,060) is second priority.** Same image-driven LCP issue with the hero carousel. **Same fix-pattern**: WebP/AVIF format + responsive variants via `srcset`. 3. **PDP (910) is third priority.** 78 product detail pages share the same template; one PDP template fix lifts all 78 simultaneously. **Most leverage of any single template fix on the site**. 4. **Search results (336) shares fix-pattern with collection**, same image-grid approach. Tackle alongside collection if the same code is shared. 5. **Cart, checkout, about, account**: low priority. Healthy LCP or low traffic; no active work. 6. **Template-level fix sequence**: * **Week 1**: Collection template (covers \~12 collection pages + search results + visually similar tail). Single template fix lifts all simultaneously. * **Week 2**: Homepage hero carousel. * **Week 3-4**: PDP template (covers all 78 PDPs). 7. **Realistic post-fix LCP forecast**: * Collection: 4,610ms → 2,200ms * Homepage: 4,820ms → 2,400ms * PDP: 3,640ms → 2,100ms * Site-weighted LCP: from 3,920ms toward 2,400ms (good band) The diagnostic flow: 1. **Sort templates by LCP × traffic share.** 2. **Identify each template's LCP element** via Lighthouse audit JSON. 3. **Apply template-level image fix-pattern** as primary lever. 4. **Re-audit each template** after fix to confirm LCP dropped. Rapid-response playbook: | Time horizon | Action | | ------------ | -------------------------------------------------------------------------------------------------------------------- | | First 1 hour | Identify worst-LCP × traffic templates. | | First week | Apply image format + responsive variants on the top template. | | Day 28 | Field LCP via [`crux_lcp_p75`](/nerve-centre/kpi-cards/website-performance/page-load-speed) reflects template fixes. | ## Sibling cards merchants should reference together | Card | Why merchants reach for it | | ------------------------------------------------------------------------------------------------------ | ---------------------------------------- | | [`psi_score_by_template`](/nerve-centre/kpi-cards/website-performance/score-by-template) | Composite score per template. | | [`psi_cwv_pass_by_template`](/nerve-centre/kpi-cards/website-performance/cwv-pass-by-template) | All-3 pass rate per template. | | [`psi_opportunity_by_template`](/nerve-centre/kpi-cards/website-performance/opportunities-by-template) | Optimisation opportunities per template. | | [`psi_slowest_template`](/nerve-centre/kpi-cards/website-performance/slowest-template) | Worst template singled out. | | [`psi_template_trend`](/nerve-centre/kpi-cards/website-performance/template-trend) | Per-template trend over time. | | [`crux_lcp_p75`](/nerve-centre/kpi-cards/website-performance/page-load-speed) | Field LCP at origin level. | | [`psi_slowest_lcp_urls`](/nerve-centre/kpi-cards/website-performance/slowest-lcp-urls) | Per-URL LCP ranking. | | [`psi_image_optimisation`](/nerve-centre/kpi-cards/website-performance/image-optimisation) | Common LCP fix lever. | ## Reconciling against the vendor's own dashboard **Where to look:** * **PageSpeed Insights**, paste each template's representative URL. * **GSC URL Inspection tool**, for individual URL field-data. **Why the Vortex IQ template view may differ from manual checks:** | Reason | Direction | What to do | | ------------------------------------------------------------------------------- | ---------------- | -------------------------------- | | **Template classification.** Vortex IQ uses URL-pattern + GA4 + theme metadata. | Variable | Confirm template-to-URL mapping. | | **Run-to-run variance.** ±10-20% per measurement. | Either direction | Use 7-day rolling. | **Cross-connector reconciliation:** primarily internal (with the LCP-related cards and per-template cards). **Quick rule for support tickets:** if a template's LCP is high, it's almost always image-driven. Check the LCP element via Lighthouse audit JSON and apply image fix patterns. ## Known limitations / merchant FAQs **Why does PDP have variable LCP across products?** Different product images. Each PDP renders a different hero image; image quality / size varies by product. **The template's representative URL** is one specific PDP; the per-template LCP shown is for that URL. **Cross-reference [`psi_slowest_lcp_urls`](/nerve-centre/kpi-cards/website-performance/slowest-lcp-urls)** for per-URL detail across all PDPs. **My collection page LCP fixes haven't moved the field metric. Why?** Lab measures one URL; field measures all collection-page URLs. Maybe one collection page got fixed but the other 11 didn't. **Template-level fixes propagate to all template URLs**, but if the deploy was URL-specific (e.g. only the test page), only that URL improves. **Should I optimise the homepage LCP element or the homepage page weight?** Both, in sequence. **LCP fix first**: convert hero image format, add preload. Then total page weight reduction (image variants + JS deferral). LCP fix has narrow but big-impact; weight reduction has broad smaller impact across many sub-metrics. **Can I lazy-load the LCP image?** No, that breaks LCP entirely (it would load lazily, after first paint). The LCP image should have `loading="eager"` and ``. Lazy-load applies to BELOW-the-fold images. *** ### Tracked live in Vortex IQ Nerve Centre *LCP by Template* is one of hundreds of KPI pulses Vortex IQ tracks across Website Performance (PageSpeed + CrUX) and 70+ other ecommerce connectors. Nerve Centre runs the detection layer; Vortex Mind investigates the cause when something moves; Ask Viq lets you interrogate any number in plain English. [Start for free](https://app.vortexiq.ai/login) or [book a demo](https://www.vortexiq.ai/contact-us) to see this metric running on your own data.