We added Web Vitals in replays so you can see which elements are related to your Web Vital scores and the overall user impact of poor Web Vitals. Our Web Vital breadcrumbs show you the rating (good, meh, or poor), the selector or React component name of relevant elements, and the duration of that Web Vital. When you hover over a Web Vital breadcrumb, the element related to that Web Vital score are also highlighted in the replay. Our supported Web Vitals in Session Replay are CLS, FID, INP, and LCP.
To see this feature, make sure your minimum SDK version is 8.29.0 (if you are on SDK version 7.x, please follow these migration docs) and have Session Replay installed .
If you have any feedback or encounter issues with this feature, please open a GitHub issue.
Github
Slack
Javascript
Python
React
Laravel
Next.js
