35 Frontend Developer Interview Questions (2026) — JavaScript, React, CSS, and What to Listen For
35 frontend developer interview questions covering JavaScript, React, CSS, performance, accessibility, and testing — with what a strong answer sounds like in each.
Short answer: Strong frontend developer interview questions cover six areas: JavaScript fundamentals, a framework like React, CSS and layout, performance, accessibility, and testing. Ask 5–7 per round and include one practical task. The best frontend engineers talk about users — load time, keyboard access, error states — not just components.
Frontend hiring has a specific trap: it's easy to hire someone who can build a beautiful demo and hard to tell whether they can build an interface that's fast on a cheap phone, usable with a keyboard, and still maintainable a year later. Framework trivia doesn't reveal that. The right questions do.
Below are 35 frontend-specific questions with what to listen for. For general engineering fundamentals and behavioral questions, pair this with our 50 Software Engineer Interview Questions guide. To generate questions tailored to your exact stack — React or Vue, design-system work or product features — try the free Interview Question Generator.
How to run a frontend interview loop
A good loop for a mid-level frontend role: one practical round (build a small component or fix a buggy one), one round on architecture, performance and accessibility, and one behavioral round. A practical task beats a whiteboard for frontend almost every time — you learn how they structure components, name things, and handle loading and error states.
JavaScript fundamentals (questions 1–7)
1. Explain the event loop, and why a long loop freezes the page. Listen for: the call stack, task and microtask queues, and that rendering waits for JavaScript. Strong candidates mention breaking up work or moving it off the main thread.
2. What's the difference between == and ===, and when would you use each? Listen for: type coercion, and a clear default of ===. This is a warm-up, not a filter.
3. Explain closures with an example from real code. Listen for: a practical case — event handlers, memoization, or a stale value bug in a React hook.
4. How do promises and async/await handle errors? Listen for: try/catch with await, .catch() on chains, unhandled rejections, and Promise.allSettled versus Promise.all.
5. What does this refer to in different contexts? Listen for: method calls, arrow functions capturing lexical this, and bind. Accept "I avoid relying on it" if they can explain why.
6. How would you cancel a fetch request when the user navigates away? Listen for: AbortController, and why stale responses cause race-condition bugs.
7. How do you debounce a search input, and why? Listen for: limiting requests while the user types, and a simple implementation with a timer.
React and component design (questions 8–14)
8. When does a React component re-render? Listen for: state changes, parent re-renders, and context changes. Bonus: how they'd find unnecessary re-renders with the profiler.
9. When would you use useMemo or useCallback, and when is it wasted effort? Listen for: measured performance problems or stable references for memoized children — not wrapping everything by default.
10. Where should state live? Listen for: keeping state as local as possible, lifting it when shared, server state in a data-fetching library, and global stores only when needed.
11. What causes the "stale closure" bug in useEffect, and how do you fix it? Listen for: dependency arrays, functional state updates, and refs.
12. How would you design a reusable modal or dropdown component? Listen for: focus management, closing on Escape, click-outside handling, portals, and a small, clear props API.
13. Server-side rendering, static generation, or client-side rendering — how do you choose? Listen for: SEO needs, how often data changes, time to first content, and hosting cost.
14. How do you handle forms with complex validation? Listen for: controlled versus uncontrolled inputs, validating on the client and the server, and accessible error messages tied to fields.
CSS and layout (questions 15–19)
15. Flexbox or Grid — how do you decide? Listen for: Flexbox for one-dimensional rows or columns, Grid for two-dimensional layouts. Real examples beat definitions.
16. How do you build a layout that works from a 320px phone to a wide desktop? Listen for: mobile-first CSS, fluid units, sensible breakpoints, and testing on real devices.
17. What causes layout shift, and how do you prevent it? Listen for: images without dimensions, late-loading fonts and ads, and reserving space.
18. How do you keep CSS maintainable in a large codebase? Listen for: a consistent approach (CSS modules, utility classes, or design tokens) and avoiding specificity wars.
19. How would you implement dark mode? Listen for: CSS custom properties, prefers-color-scheme, a saved user choice, and avoiding a flash of the wrong theme on load.
Performance (questions 20–25)
20. A page takes 6 seconds to load on mobile. Where do you start? Listen for: measuring first (Lighthouse, the network panel, real user data), then looking at JavaScript bundle size, images, and render-blocking resources.
21. What are Core Web Vitals and how do you improve each? Listen for: LCP (load the main content fast), INP (keep interactions responsive), CLS (avoid layout shift), with a concrete fix for each.
22. How do you reduce JavaScript bundle size? Listen for: code splitting by route, lazy loading, removing heavy dependencies, and checking the bundle analyzer.
23. How do you optimize images? Listen for: modern formats like WebP or AVIF, responsive sizes, lazy loading below the fold, and explicit width and height.
24. How would you render a list of 10,000 items? Listen for: virtualization, pagination, or infinite scroll, and why rendering all of them at once hurts.
25. What's the difference between caching in the browser, a CDN, and a service worker? Listen for: where each lives, cache headers, and cache-busting with hashed file names.
Accessibility (questions 26–30)
26. How do you make a custom button accessible? Listen for: "use a real <button>" first. If they must build a custom one: role, tabindex, and keyboard handlers for Enter and Space.
27. How do you test a page for accessibility? Listen for: keyboard-only navigation, a screen reader, automated checks like axe, and colour contrast checks.
28. When should you use ARIA attributes? Listen for: only when native HTML can't express something — "no ARIA is better than bad ARIA."
29. How do you handle focus when a modal opens and closes? Listen for: moving focus into the modal, trapping it, and returning it to the trigger on close.
30. Why do accessible forms matter beyond compliance? Listen for: labels, clear errors, and the point that accessibility improves usability for everyone.
Testing and collaboration (questions 31–35)
31. What do you unit test in a frontend app, and what do you leave to end-to-end tests? Listen for: logic and components tested through user behaviour, with a few end-to-end tests for critical flows like checkout or signup.
32. How do you test a component that fetches data? Listen for: mocking the network layer, testing loading, success, and error states.
33. How do you work with designers when a design is hard to build? Listen for: early conversations, proposing alternatives, and respecting the intent rather than pixel-matching blindly.
34. How do you review a teammate's frontend pull request? Listen for: checking behaviour and states in the browser, accessibility, and performance — not just code style.
35. Tell me about a UI you built that users struggled with. What did you change? Listen for: using real feedback or data, and humility about their own work.
How to score frontend candidates
Rate candidates 1–4 on JavaScript and framework depth, UI quality and CSS, performance awareness, accessibility, and collaboration. The practical round usually decides it: look at how they handle loading, empty, and error states, whether their markup is semantic, and whether they test in a narrow viewport without being asked.
Combine this list with the behavioral rounds in 30 Behavioral Interview Questions for Software Engineers, and see the backend developer interview questions if you're hiring full-stack.
Shortlist faster
Before any of these interviews happen, someone has to read the CVs. HireBest scores a whole batch of frontend CVs against your JD — React depth, accessibility experience, performance work — with written reasoning for every score. Our guide on how to screen software engineer resumes covers what to look for manually.
Frequently asked questions
What should a frontend developer interview include?
A practical coding task, questions on JavaScript and your framework, CSS and layout, performance, accessibility, and a behavioral round. Three rounds is enough for most mid-level roles.
Is a take-home test better than live coding for frontend roles?
Both work. A short take-home (two to three hours, paid if longer) shows how they structure real code. Live coding shows how they think and communicate. Pick one, and keep it realistic.
How much should I focus on React-specific questions?
Enough to confirm they can work in your stack, but weight fundamentals higher. A developer who understands JavaScript, the browser, and accessibility learns any framework quickly.
How do I assess frontend performance skills in an interview?
Give them a slow page or a Lighthouse report and ask where they'd start. Strong candidates measure before changing anything and can explain LCP, INP, and CLS in plain terms.
Can I generate frontend interview questions from a job description?
Yes. HireBest's free Interview Question Generator reads your JD and writes role-specific technical and behavioral questions in under a minute.
Related
Try it
Start screening for free
HireBest scores every CV against your JD with written reasoning — free to try.
Try HireBest free