How to fix your INP core web vital

[andyvan-ph]

Summary

Suggested by @Lior539

◦ Install CoreWebVitals GitHub library
◦ Use event capture to capture INP metrics
◦ Write HogQL query to view insights for 50th, 75th, 90th percentile
◦ Enable session replays to pinpoint problematic interactions
◦ Solve it
▪︎ If react, use suspense, dynamic etc.
▪︎ Show spinners

[pauldambra]

No, don't do that..

◦ Install CoreWebVitals GitHub library
◦ Use event capture to capture INP metrics
◦ Write HogQL query to view insights for 50th, 75th, 90th percentile

turn on web vitals autocapture in posthog and use all our querying power

[pauldambra]

https://us.posthog.com/project/2/settings/project#web-vitals-autocapture

[Lior539]

Some more details:

Its basically converting this post into a posthog tutorial - https://www.remoterocketship.com/advice/how-i-debugged-and-fixed-inp

Format:

• Enable web vitals autocapture
• Enable session replay
• Capture web vital events
• Create dashboard to view
• Create replay playlist with filters
• Tips on common ways to fix (like in my blog)