What is CLS by on-page errors
CLS by on-page errors shows how Cumulative Layout Shift (CLS) varies depending on whether a page encountered any errors during load — and what kind of errors occurred.
These may include:
JavaScript execution errors
Broken image or font loads
CSS failures
Resource 404s or permission denials
Other unknown runtime issues
Even a single error can delay rendering, block layout paints, or break critical components — especially when the LCP element depends on the failed asset.
Healthy CLS by on-page errors sample
In a healthy setup:
The “No errors” category dominates, with fast (green) LCP values
Other error categories (if present) show low volume and no meaningful performance impact
Even when small errors happen, critical content still paints quickly thanks to resilient design
This indicates that your site:
Loads reliably without missing resources
Gracefully handles fallback cases
Doesn’t let minor errors cascade into UX problems
Unhealthy CLS by on-page errors sample
When LCP slows down on error-prone pages, it usually means:
The LCP element (often a large image or text block) is failing to render on time due to a broken resource
JavaScript hydration or layout logic is interrupted by runtime exceptions
Fonts or stylesheets are missing, leading to FOUT/FOIT or delayed layout rendering
There's no fallback in place, so missing assets block visual completion
You may notice:
Delayed or invisible hero content
Layout jumping after late font/style loads
Poor user experience with flashing, broken, or unstyled elements
Resolving unhealthy CLS by on-page errors
Go-to action plan to resolve an unhealthy CLS by on-page errors:
Ask Uxi to analyze your CLS by on-page errors values and suggest improvements
Use Filters to isolate sessions with specific error codes or types (e.g., JS vs image vs font).
Simulate CLS of the suspected lens to see if fixing it will resolve the CLS by on-page errors. If yes, this is where the resolution focus should be.
Use an automated CLS optimization tool like Navigation AI to improve your CLS by on-page errors values
Once you’ve improved CLS, set an alert to be the first to know if it starts worsening again.
Try it yourself
Discover how your website performs with real user data.