Web Performance interview questions

Core Web Vitals, bundle splitting, image strategy, and measuring rather than guessing.

5 questions in Frontend Engineering.

Frontend EngineeringA 22-minute read on how the topic fits together, before the questions.Frontend fundamentals57 short answers on one page, for revising rather than studying.

hard5

hardScenarioConceptDesign

INP went from 150ms to 400ms the week a marketing tag was added. Marketing says the script is async and cannot be the cause. How do you prove it either way and fix it?

Async controls when a script downloads, not what it does to the main thread once it executes, so an async tag can still block interaction handling. Prove it with field data attributed to the interaction: INP breaks into input delay, processing and presentation, and each points elsewhere. Then move the work off the critical path.

4 minmid, senior, staff

hardConceptScenario

A page has a poor Largest Contentful Paint. How do you diagnose it and what do you actually change?

Split the LCP into TTFB, resource load delay, resource load time and render delay, use field attribution rather than a single lab run to see which part dominates, then fix that part specifically - prioritise the hero image, stop lazy-loading it, and remove render-blocking work.

7 minmid, senior, staff

hardScenarioDesign

How do you resolve unacceptable INP degradation caused by massive, synchronous JavaScript execution blocking the main thread?

Evaluate the candidate's understanding of the JavaScript event loop, rendering pipeline, and modern techniques for yielding to the main thread to improve INP. Use this frontend answer to show the decision, trade-off, and evidence rather than a memorised definition. It also connects performance to the point an interviewer is testing.

3 minsenior, staff

hardConceptScenario

Field data says your page has an INP of 400 ms. How do you find the cause and fix it?

Split the interaction into input delay, processing time and presentation delay, then attribute a real interaction from the field rather than guessing. Most of the budget is usually spent before your handler runs or after it returns, so yielding and cutting rendering cost beats optimising the handler.

4 minmid, senior, staff

hardScenarioDesign

Users say the page jumps around while it loads, but your synthetic audit reports no layout shift at all. How do you find it and fix it?

Layout shift is a field problem: it depends on network speed, consent banners, ads and personalisation that a lab run never sees. Collect layout-shift entries from real sessions with their source nodes, then reserve space for whatever moved.

6 minmid, senior, staff