CLS Finder
Inspect Cumulative Layout Shift with a timeline of layout shifts, screenshots, and animations.
- Frame-by-frame timeline
- Viewport-specific shifts
- Visual element evidence
See Exactly What Shifts on Your Page
CLS Finder turns a layout shift report into an interactive, frame-by-frame timeline inspired by the Chrome DevTools Performance panel. Instead of staring at a single number, you can scrub through the page load, watch where content jumps, and identify the precise elements responsible for each shift.
Hover anywhere on the timeline to preview the captured frame at that moment. When the cursor lands on a recorded layout shift, the preview switches to an animation of the shift along with the element selector and how its bounding box moved, so you can move from "my CLS is high" to "this specific element moved" in seconds.
Analyse Every Viewport Independently
Layout stability is device-dependent. An image that fits neatly on desktop might push content down on mobile, so CLS Finder reports mobile, tablet, and desktop separately. Each viewport gets its own timeline, overall CLS score, and a grid of layout-shift cards you can open for a full breakdown including the highlighted region and affected elements.
This makes it straightforward for developers, performance engineers, and SEO professionals to prioritise fixes where they matter most and to verify that a change actually reduced shifting rather than just moving the problem elsewhere.