A new tool in Chrome to detect the causes of layout changes: how it will affect web development

The Chrome development team has introduced a new feature called "Layout Shift Culprits". This feature is designed to improve debugging capabilities for Cumulative Layout Shift (CLS), an important aspect of website performance. It works in Chrome's Insights panel and provides developers with the ability to visualize layout change events in real time, play frame-by-frame change events, automatically identify the most important change clusters, and more.

"This development is important because CLS is a key criterion in Google's Core Web Vitals"

🚀 The new tool lets you detect issues with third-party injected content, debug dynamic content loading issues, optimize ad serving, improve media loading strategies, and fine-tune lazy loading implementations.

• 📌 CLS measures visual stability, which affects user experience, search rankings, mobile usability, and page performance metrics.
• 📌 Layout Shift Culprits is available in Chrome Canary and may affect how developers optimize performance when it reaches stable versions of Chrome.
• 📌 Developers can download Chrome Canary separately from the stable Chrome browser to test both versions simultaneously.