Record and analyze a performance trace with DevTools
bookmark_borderbookmark
Stay organized with collections
Save and categorize content based on your preferences.
Jecelyn Yeen
Use the Performance panel in DevTools to diagnose performance issues. By recording a trace, you can dive deeper into your website's loading process and runtime behavior, identifying bottlenecks and areas for optimization.
Watch the video to learn how to:
How to record a performance trace to investigate Core Web Vitals issues.
Navigate and zoom into a portion of the performance trace.
Analyze network activities.
Use the insights sidebar to focus on the most relevant parts of the trace.
Use annotations to collaborate with other developers on fixing performance issues.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-12-05 UTC."],[],[]]