How to use Performance Insights in Chrome?

Performance Insights is a simplified, more visual version of the Performance tab in Chrome DevTools. It helps you quickly understand what is slowing down a page, without deep timeline analysis.

---

#How to open it:

1. Open DevTools: Ctrl+Shift+I / Cmd+Opt+I
2. Go to the Performance Insights tab (if it's not visible, click >> on the right and pick it from the list)
3. Click the Record button (or reload the page)
4. Wait 5-10 seconds, the recording stops automatically

---

#What it shows:

• Key loading metrics
• FCP, LCP, CLS, TTI, TBT
• Events and bottlenecks
• blocking scripts, Layout Shifts, main thread delays
• Improvement recommendations
• what specifically slows down rendering (for example: "long tasks", "animations", "slow styles")

---

#Blocks in the interface:

• Main Thread Activity: a visual scale showing heavy operations
• Details: click on an event to get details: which function, how long it took, where it is in the code
• Web Vitals Timeline: vertical markers for the moments of FCP, LCP, and so on
• Recommendations: automatic optimization tips

---

#What it's good for:

• quickly spotting problems without diving into the profiler
• analyzing the impact of a specific script/component on rendering
• diagnostics during layout work or before full profiling

---

Conclusion: Performance Insights is a fast performance scanner for a page that shows, within a minute, exactly where the interface slows down and points toward optimizations. Good for quick checks and regular monitoring.