> ## 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. # Layout Stability Over Time, Website Performance (PageSpeed + CrUX) > Layout Stability Over Time for Website Performance (PageSpeed + CrUX) stores. Tracked live in Vortex IQ Nerve Centre. How to read it, why it matters, and h... **Metrics type:** [Supporting Metrics](/nerve-centre/overview#metrics-types-explained) • **Category:** [Website Performance](/nerve-centre/connectors#connectors-by-type) ## At a glance > **Cumulative Layout Shift p75 over time**, daily time-series of mobile CLS from CrUX. Pairs with [`crux_cls_p75`](/nerve-centre/kpi-cards/website-performance/layout-stability) snapshot. **The most regression-prone CWV** in terms of inadvertent change: theme updates, third-party widget version bumps, and hero image swaps frequently introduce new layout shifts. The trend view surfaces these regressions; the snapshot view alone misses them. **CLS definition changed in May 2021** to use session windows; year-over-year comparisons need to acknowledge that boundary. | | | | ----------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | **What it counts** | Time-series of `cumulative_layout_shift` p75 across the rolling 28-day CrUX window. Each daily data point reflects the trailing 28 days of real-user shift measurements. | | **Sample type** | **Field data** sourced from CrUX. Lab equivalent: [`psi_lab_cls`](/nerve-centre/kpi-cards/website-performance/lab-layout-stability) measured per audit. | | **The May 2021 boundary** | Google updated CLS calculation to use "session windows", gaps of 1+ second between shifts reset the cumulative counter. Pre-May 2021 used a single cumulative score for the entire page lifetime. **The new methodology produces lower CLS scores for sites with brief shift events**; comparing across the boundary needs care. | | **Common CLS regression patterns** | (1) **Step regression on hero image swap**: marketing replaces a 16:9 hero with a 4:3 version without updating aspect-ratio CSS, overnight CLS spike. (2) **Step regression on widget update**: chat widget or popup vendor changes mounting behaviour. (3) **Step regression on cookie banner change**: legal team adds new GDPR/CCPA banner that pushes content. (4) **Slow drift**: gradual accumulation of small late-loading content additions. | | **Reading the trend** | Same conventions as LCP/INP trends: direction, slope, inflection points, threshold crossings (0.1 = good/needs-improvement boundary). | | **Why CLS regressions are easy to spot in the trend** | CLS regressions are usually step-shaped because they trace to specific shipped changes (CSS edits, widget updates) rather than gradual accumulation. **Sharp inflection points are common**; the trend often shows clear "before" and "after" plateaus separated by a regression event. | | **Sample size threshold** | CrUX requires sufficient real-user volume (\~1,000+ sessions per 28 days). | | **Currency** | n/a, time-series of unitless CLS scores. | | **Time window** | `28D rolling × T` | | **Alert trigger** | `current value > 0.1` OR `7-day rolling delta > +0.05` (regression). | | **Sentiment key** | `psi_cls` | | **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, mobile CLS trend over 6 months ending Wednesday 15 May 26. | Month | CLS p75 | Δ vs prior | Notes | | ---------------------------- | -------: | ----------------: | --------------------------------------------------------------- | | Nov 25 | 0.06 | (baseline) | In good band | | Dec 25 | 0.07 | +0.01 | Stable | | Jan 26 | 0.10 | +0.03 | Crossed into "needs improvement" boundary | | Feb 26 | 0.13 | +0.03 | New cookie consent banner deployed (pushed content) | | Mar 26 | 0.15 | +0.02 | Hero carousel swapped to taller aspect ratio without CSS update | | Apr 26 | 0.16 | +0.01 | Klaviyo popup repositioning bug | | **May 26** | **0.17** | **+0.01** | **Current state, "needs improvement"** | | **Cumulative drift Nov→May** | | **+0.11 (+183%)** | **6-month silent regression** | What the trend is telling us: 1. **CLS nearly tripled over 6 months.** Started in good band (0.06); now in needs-improvement (0.17). Each individual increment was small enough not to trigger immediate alarm; cumulative effect is meaningful. 2. **Three step inflection points are clearly identifiable**: * **Feb 26 cookie banner deployment**: new GDPR/CCPA banner appearing post-paint and pushing content (+0.03) * **Mar 26 hero carousel aspect-ratio change**: marketing-driven creative refresh that taller-cropped hero images without updating the CSS `aspect-ratio` reservation (+0.02) * **Apr 26 Klaviyo popup repositioning**: vendor-side update changed popup mounting behaviour (+0.01) 3. **CLS regressions cleanly trace to events**, unlike LCP drift which can be more diffuse. **Each contribution has a specific fix**: * Cookie banner: switch to `position: fixed; bottom: 0` overlay (covered in [`crux_cls_p75`](/nerve-centre/kpi-cards/website-performance/layout-stability) playbook) * Hero carousel: update `aspect-ratio` CSS to match new image dimensions, or add explicit `width` and `height` HTML attributes * Klaviyo popup: configure popup container with reserved fixed-position space 4. **Recovery path is clean** because each contribution maps to a one-line CSS or config fix. **Total recovery time: 1-2 days of focused work**; field reflection over 28 days. 5. **Future protection**: alert on `7-day rolling delta > +0.03` catches the next CLS regression within days of it shipping. **CLS is the easiest CWV to alert on** because regressions are typically step-shaped and sharp; small thresholds catch them reliably. The diagnostic flow: 1. **Identify each inflection point** in the trend. 2. **Cross-reference with deploy log + content management activity + vendor update changelogs**. 3. **Apply the right fix per cause**: aspect-ratio CSS, position-fixed banner, reserved-space widget container. 4. **Re-audit; field metric absorbs over 28 days**. Rapid-response playbook: | Time horizon | Action | | -------------- | ----------------------------------------------- | | First 1 hour | Identify inflection events. | | First 24 hours | Apply CSS fixes (aspect-ratio, position-fixed). | | First 7 days | Field CLS partial movement. | | Day 28 | Field CLS fully reflects fixes. | ## Sibling cards merchants should reference together | Card | Why merchants reach for it | | ---------------------------------------------------------------------------------------------------- | ------------------------------------------------ | | [`crux_cls_p75`](/nerve-centre/kpi-cards/website-performance/layout-stability) | Static snapshot. | | [`crux_lcp_trend`](/nerve-centre/kpi-cards/website-performance/load-speed-over-time) | Sister CWV trend. | | [`crux_inp_trend`](/nerve-centre/kpi-cards/website-performance/responsiveness-over-time) | Sister CWV trend. | | [`crux_pass_rate_trend`](/nerve-centre/kpi-cards/website-performance/speed-test-pass-rate-over-time) | All-three pass rate trend. | | [`crux_regression_timeline`](/nerve-centre/kpi-cards/website-performance/crux-regression-timeline) | Composite regression detection. | | [`psi_worst_cls_urls`](/nerve-centre/kpi-cards/website-performance/worst-cls-urls) | Per-URL CLS ranking. | | [`psi_lab_cls`](/nerve-centre/kpi-cards/website-performance/lab-layout-stability) | Lab CLS measurement. | | [`psi_image_optimisation`](/nerve-centre/kpi-cards/website-performance/image-optimisation) | Aspect-ratio CSS pairs with image format work. | | [`psi_third_party_cost`](/nerve-centre/kpi-cards/website-performance/third-party-cost) | Late-loading widgets often cause CLS regression. | ## Reconciling against the vendor's own dashboard **Where to look:** * **GSC → Core Web Vitals trend**, surfaces 90-day CLS trend. * **CrUX BigQuery dataset**, historical CLS data with the May 2021 methodology change visible. * **Web Vitals Chrome extension**, live CLS measurement during page-load + interaction. **Why the Vortex IQ CLS trend may differ from external trend views:** | Reason | Direction | What to do | | ----------------------------------------------------------------------------------------------- | --------------------------------- | ------------------------------------------------ | | **Pre-May 2021 methodology change.** Old data uses single-cumulative; new uses session windows. | Pre-May 2021 typically **higher** | Anchor comparisons within the post-May-2021 era. | | **Window timing.** | Vortex IQ **lags** 1-2 days | Wait for refresh. | | **Smoothing.** Each daily point is 28-day rolling. | Smoothed | Step regressions appear gradual. | **Cross-connector reconciliation:** primarily internal (with [`crux_cls_p75`](/nerve-centre/kpi-cards/website-performance/layout-stability), [`psi_worst_cls_urls`](/nerve-centre/kpi-cards/website-performance/worst-cls-urls)). **Quick rule for support tickets:** if a merchant says *"CLS jumped overnight"*, it's almost certainly a single shipped change. Cross-reference deploy log + CMS edits + vendor changelogs for the exact date. ## Known limitations / merchant FAQs **My CLS jumped 0.05 overnight. What likely caused it?** A single shipped change. CLS regressions are typically step-shaped, not gradual. Common culprits: cookie banner update, hero image replacement without aspect-ratio update, widget vendor version bump, theme update. **Cross-reference deploys and content changes** for the exact date. **Why is CLS easier to track in trend than LCP?** CLS regressions are sharp (a layout shift either exists or doesn't); LCP regressions are gradual (image got 200KB heavier). The trend curve clearly shows step changes for CLS; LCP drift looks more diffuse. **Should I anchor my CLS comparison pre or post May 2021?** Post-May 2021. The methodology changed; pre-2021 data is not directly comparable. Most modern analyses anchor on the new session-window methodology. **My CLS is steady at 0.08 for months. Is that good enough?** Yes; 0.08 is comfortably in the good band (under 0.1). No active CLS work needed; just protect from regression via alerts. **What's the smallest CLS regression worth alerting on?** +0.03 over 7 days. Smaller deltas are usually noise; larger deltas almost always trace to a specific event. Setting the alert at +0.03 catches real regressions without false positives. **Can Vortex IQ tell me which specific element shifted?** Not from CrUX alone, CrUX only provides the score. **Lab analysis** via [`psi_worst_cls_urls`](/nerve-centre/kpi-cards/website-performance/worst-cls-urls) and DevTools Performance tab identifies the specific shifting elements. Use the trend to detect; use lab to diagnose. *** ### Tracked live in Vortex IQ Nerve Centre *Layout Stability Over Time* 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.