Frontend Performance

Frontend performance is how quickly and smoothly a web application loads, renders, and responds to user input.

It affects user satisfaction, accessibility, SEO, conversion, and perceived product quality.

TTFB measures how long it takes the browser to receive the first byte of the response after making a request.

LCP measures when the largest visible content element finishes rendering, indicating perceived load speed.

INP measures how responsive a page feels by tracking the delay between an interaction and the next visual update.

CLS measures unexpected movement of page elements during load or interaction.

Images are often the heaviest assets on a page, so compression, resizing, and modern formats can cut load time significantly.

Lazy loading delays non-critical resources until they are needed, such as images below the fold.

Code splitting breaks JavaScript into smaller chunks so users download only what is needed for the current page.

Large bundles slow parsing, compilation, and execution in addition to network transfer.

Tree shaking removes unused exports from a bundle during build so less code ships to the browser.

Render blocking happens when the browser must wait for certain resources like CSS or synchronous JavaScript before painting content.