Frontend Developer Interview Questions
Frontend interviews test three layers: JavaScript fundamentals, framework fluency, and whether you understand what the browser is actually doing. These questions come up constantly at every level — study the "what they are checking" notes, because interviewers care far more about your reasoning than the textbook definition.
Q1Explain the JavaScript event loop. What happens when a promise resolves inside a setTimeout callback?
What they're checking: Whether you understand the task queue vs microtask queue distinction, or just recite "JS is single-threaded".
A strong answer: A strong answer walks the ordering: synchronous code, then all microtasks (promises), then the next macrotask — and mentions a concrete bug this causes, like UI updates landing a frame late.
Q2How does React reconciliation work, and when do key props cause unexpected re-renders?
What they're checking: Framework depth beyond tutorials — most candidates use keys without knowing why.
A strong answer: Explain the diffing heuristic (same type = update, different type = remount), then give the classic failure: using array index as key in a reorderable list, causing state to stick to positions instead of items.
Q3What causes layout thrashing, and how would you fix a scroll handler that janks?
What they're checking: Browser rendering pipeline knowledge — style, layout, paint, composite.
A strong answer: Name the read-write interleaving problem (reading offsetHeight after writing styles forces sync layout), then fix with batching reads/writes, requestAnimationFrame, or transform-only animations.
Q4When would you choose CSS Grid over Flexbox? Give a concrete layout where Grid is clearly better.
What they're checking: Whether you reason in one dimension vs two, or just default to one tool.
A strong answer: Flexbox for one-dimensional flow, Grid for two-dimensional placement. A strong example: a dashboard where cards must align across both rows and columns regardless of content height.
Q5How do you make a large list render fast — say 50,000 rows?
What they're checking: Practical performance instincts, not just naming a library.
A strong answer: Windowing/virtualisation as the core idea, plus the details: fixed vs variable row heights, overscan, and why the DOM node count — not the data size — is what kills you.
Q6Explain how you would implement debounce, and when you would pick throttle instead.
What they're checking: Closure fluency and whether you map tools to use-cases.
A strong answer: Sketch the closure-over-timer implementation, then map: debounce for search-as-you-type (only the final state matters), throttle for scroll position (regular samples matter).
Q7What is a hydration mismatch in server-rendered React, and how do you avoid one?
What they're checking: SSR experience — this separates candidates who have shipped SSR from those who read about it.
A strong answer: Server HTML and first client render must match; anything time-, random-, or window-dependent diverges. Fixes: render-after-mount for client-only bits, stable IDs, and suppressing where genuinely unavoidable.
Q8How would you diagnose and improve a page with a poor Largest Contentful Paint?
What they're checking: Whether you can work backwards from a Core Web Vitals number to real causes.
A strong answer: Identify the LCP element first, then attack its critical path: server response, render-blocking resources, image size/priority, font loading. Bonus points for knowing fetchpriority and preload trade-offs.
Now try answering these under interview pressure
InterviewGPT runs a mock Frontend interview — asks questions like these tailored to your situation, listens to your spoken answers, and scores every one with written feedback. First session free, no credit card.
Start a free Frontend interview