In-depth articles, tutorials, and guides on Performance — covering everything from fundamentals to advanced patterns.
Memory leaks in UI applications are subtle and cumulative — they rarely cause an immediate crash but instead cause the application to slow down over time until the tab becomes unresponsive. Knowing where they come from and how to find them in DevTools is a critical skill for building long-lived browser applications.
Interaction to Next Paint replaced First Input Delay as a Core Web Vital in March 2024. Unlike FID, which measured only the delay before an interaction was handled, INP measures the full time from any interaction to the next paint — making it a far more accurate signal of real-world responsiveness.
Cumulative Layout Shift measures visual instability — the total amount of unexpected layout movement that occurs during a page's lifetime. A high CLS score means elements shift under the user's cursor right as they try to click. It is one of the most impactful Core Web Vitals for perceived quality.
Largest Contentful Paint is Google's primary metric for perceived load speed. It measures when the biggest visible content element finished rendering — and it is one of the most impactful Core Web Vitals for both user experience and search ranking.
Layout thrashing is one of the most common and most fixable causes of janky UIs. It happens when JavaScript forces the browser to repeatedly recalculate layout in a single frame — and it can turn a 60fps animation into a stuttering slideshow.
From the moment you type a URL to the moment pixels appear on screen, the browser executes a precise multi-stage pipeline. Understanding every stage — and what can interrupt each one — is the foundation for all frontend performance work.
Before a user sees anything on screen, the browser has to go through a precise sequence of steps. Understanding that sequence — the critical rendering path — is the foundation of every meaningful frontend performance optimization.