Offermic
Try it free

Frontend Developer Interview Questions (With Tips)

Frontend Developer, Technology & Software. 21 questions.

Updated

Written by

The short answer

Frontend developer interviews test whether you can build interfaces that are fast, accessible and maintainable. Expect questions on page performance, Core Web Vitals, accessibility, state management, browser quirks and working with designers. Strong answers name a user-facing metric, explain the trade-off behind each technical choice, and show you test on real devices.

Key takeaways

  • Frame technical answers around the user: load time, responsiveness, accessibility and visual stability.
  • Know how you would diagnose a slow page before you name a fix.
  • Accessibility is a core skill, not a bonus; bring one concrete example.
  • Show how you collaborate with designers when a mockup is hard or costly to build.
  • Prepare questions about the design system, browser support and release process.

What interviewers look for

  • User-centered performance thinking: what the user waits for, not just bundle size
  • Working knowledge of semantic HTML, keyboard access and screen reader behavior
  • Sensible state management choices with reasons, not framework loyalty
  • A good relationship with design: pushing back with options, not refusals
  • Testing habits across browsers, devices and slow networks
  • Components built to be reused, documented and themed

Red flags

  • Treating accessibility as something QA or a plugin will handle later
  • Reaching for a new framework or library to solve every UI problem
  • Only testing on a fast laptop with a fast connection
  • Dismissing design feedback as 'just pixels'
  • Cannot explain what happens between typing a URL and seeing the page
  • Performance claims with no measurement behind them

Numbers worth bringing

  • Core Web Vitals: Largest Contentful Paint, Interaction to Next Paint, Cumulative Layout Shift
  • JavaScript bundle size shipped to the first page load
  • Lighthouse or axe accessibility issues fixed
  • Front-end error rate from client monitoring
  • Conversion or task completion on a flow you rebuilt
  • Design-system component adoption across teams

The questions

Technical

  1. 1

    A product page loads slowly on mobile. Walk me through how you would find out why.

    Tip: Start with field data and a profiler trace, then separate network, render and script costs.

  2. 2

    How do you decide where state should live in a front-end application?

    Tip: Contrast local, shared and server state and explain why you would not globalize everything.

  3. 3

    How would you make a custom dropdown accessible?

    Tip: Cover keyboard navigation, focus management, ARIA roles and testing with a screen reader.

  4. 4

    What happens in the browser between entering a URL and seeing the rendered page?

    Tip: Hit DNS, the request, HTML parsing, CSS and JavaScript loading, layout and paint at a high level.

  5. 5

    When would you choose server-side rendering over client-side rendering?

    Tip: Talk about first paint, SEO, interactivity cost and hosting complexity, not just preference.

  6. 6

    How do you prevent layout shift on a page with ads, images and web fonts?

    Tip: Mention reserved dimensions, font loading strategy and placeholders for late content.

  7. 7

    How do you test front-end code, and what do you choose not to test?

    Tip: Show a balance of unit, integration and end-to-end tests and why you skip brittle snapshot tests.

  8. 8

    How would you structure CSS so a large app stays maintainable?

    Tip: Discuss design tokens, scoping, naming conventions and avoiding specificity wars.

  9. 9

    How would you explain a front-end performance trade-off to a non-technical stakeholder?

    Tip: Translate it into user impact such as seconds of waiting or lost sign-ups.

Behavioral

  1. 10

    Tell me about a time you made a web page measurably faster.

    Tip: Give the baseline metric, the change (code splitting, image sizing, caching) and the after number.

  2. 11

    Describe a time you fixed an accessibility problem that had shipped.

    Tip: Say how it was found, who it affected, and what you changed in the process to catch it earlier.

  3. 12

    Tell me about a component you built that other teams reused.

    Tip: Explain the API design, documentation and how you handled requests for one-off variations.

  4. 13

    Tell me about a disagreement with a designer or product manager about the UI.

    Tip: Show you brought evidence such as a usability test or analytics rather than opinion.

  5. 14

    Tell me about a time you shipped something that broke in production. What happened next?

    Tip: Cover detection, rollback, the user impact and the test or check you added afterwards.

Situational

  1. 15

    A designer hands you a mockup with an animation that will hurt performance. What do you do?

    Tip: Prototype a cheaper alternative, show the cost with numbers and agree on a version together.

  2. 16

    A bug only appears in one browser and you cannot reproduce it on your machine. How do you proceed?

    Tip: Use a device lab or remote browser, gather user agent data and isolate with a minimal test case.

  3. 17

    Your team wants to migrate to a new framework mid-project. How do you evaluate it?

    Tip: Weigh migration cost, team skills, ecosystem and whether an incremental path exists.

  4. 18

    A marketing team wants a third-party script added to every page. What concerns would you raise?

    Tip: Mention performance, privacy, security and loading it asynchronously or only where needed.

Motivation

  1. 19

    How do you keep up with changes in the front-end ecosystem without chasing every trend?

    Tip: Name your filters, such as browser support data and whether it solves a problem you have.

  2. 20

    Why do you prefer front-end work over back-end or full-stack roles?

    Tip: Connect it to caring about what users see and feel, with a specific example.

  3. 21

    What is a product interface you admire, and what would you improve about it?

    Tip: Pick something specific and critique it with both usability and technical reasons.

Frontend developer interview questions test whether you can build interfaces that load fast, work for everyone and stay maintainable as the product grows. Expect questions on performance, accessibility, state management, browser behavior and collaboration with design, and answer them with user-facing results rather than a list of frameworks.

What do frontend interviews focus on?

The U.S. Bureau of Labor Statistics groups this work under web developers and digital designers, who “create and maintain websites” and test interfaces “for usability,” and it projects 5% employment growth for the group from 2025 to 2035. Hiring managers for these roles usually probe three layers:

  • The browser. How pages load, render and respond, and why a page feels slow.
  • The code. Component structure, state, CSS architecture and tests.
  • The people. How you work with designers, product managers and back-end engineers.

Accessibility comes up more often than many candidates expect. The W3C’s Web Content Accessibility Guidelines (WCAG) are the standard most teams reference, with WCAG 2.2 the current version. You do not need to recite success criteria, but you should be able to describe keyboard support, focus handling and color contrast in your own work.

For the broader engineering loop, including incident and design questions, see the software engineer interview questions and our tech industry guide.

How do you answer a frontend performance question?

Diagnose before you prescribe. A good answer to “this page is slow” goes in this order:

  1. Measure where users feel it. Field data first, then a lab trace on a throttled mobile profile.
  2. Split the cost. Is it network (large images, too many requests), rendering (layout thrash) or script (a heavy bundle blocking the main thread)?
  3. Fix the biggest cost first and re-measure.
  4. Guard it. A performance budget in CI or an alert so the regression does not come back.

Candidates who start with “I would add lazy loading” before measuring tend to lose points, even when lazy loading is the right answer.

Example STAR answer: fixing a slow checkout page

Example answer — mid-level frontend developer, question: “Tell me about a time you made a web page measurably faster.”

  1. Situation

    Our checkout page took over four seconds to show the payment form on mid-range Android phones, and mobile checkout completion was well below desktop.

  2. Task

    I was asked to improve mobile load time without redesigning the page, within one sprint.

  3. Action

    I profiled the page on a throttled device and found a large date-picker library and an analytics bundle loading before the form. I split the date picker into a lazily loaded chunk, deferred the analytics script, and sized the product images properly. I also added a bundle-size check to CI so new dependencies had to be justified.

  4. Result

    Time until the payment form was usable dropped from about 4.2 to 1.9 seconds on our test device, and mobile checkout completion rose by several points over the next month. The CI check has since blocked two heavy dependencies.

Why it works: it starts from a user problem, shows measurement, credits specific changes and ends with prevention.

Which behavioral stories should you prepare?

Frontend work produces visible results, which makes stories easier to quantify. Prepare one for each of these:

  • A performance win with before-and-after numbers.
  • An accessibility fix and what changed in your process.
  • A disagreement with your boss or a designer, settled with evidence.
  • A production bug you shipped and the mistake and what you learned.
  • A reusable component or design-system contribution.

Structure each with the STAR method, and keep the Situation to two sentences.

What questions should you ask the interviewer?

  • “Is there a shared design system, and who maintains it?”
  • “Which browsers and devices do you officially support?”
  • “How are accessibility issues found and prioritized today?”
  • “How do front-end changes get reviewed and released?”
  • “How closely do developers work with designers during discovery?”

More ideas are in our guide to questions to ask the interviewer.

How should you practice?

Answer three of the technical questions above out loud, as if explaining to a teammate who has not seen the code. Time yourself: most answers should land in one to two minutes. Then pick a behavioral story and check that it names at least one number a user would care about. If your first round is a recorded screen, our video interview tips cover camera, pacing and retakes.

Questions people also ask

Do frontend interviews focus on one framework?

Some job posts list a framework, but most spoken questions test fundamentals that transfer: rendering, state, accessibility, performance and testing. Explain concepts first and mention framework specifics as examples.

What should a frontend developer bring to a behavioral interview?

Two or three stories with a user-facing result: a speed improvement, an accessibility fix, a reusable component or a flow you rebuilt that changed conversion.

Sources

  1. Web Developers and Digital Designers: Occupational Outlook Handbook, U.S. Bureau of Labor Statistics
  2. WCAG 2 Overview, W3C Web Accessibility Initiative

Written by, Founder

Can Garip is the founder and developer of this app. He builds the AI mock interview product and writes its interview preparation guides.

Drafted with AI assistance, then edited and fact-checked by the author.

How we write