Advanced interview questions in Frontend Dev, page 6
Building an accessible combobox with ARIA
Input has role combobox with aria-expanded and aria-controls, listbox holds options, and choose aria-activedescendant to keep focus in the input versus roving DOM focus.
Respecting prefers-reduced-motion in a design system
Gate CSS animations behind the media query, read the same preference in JS via matchMedia, and centralize motion tokens.
How would you design useCounter to support shared or independent state?
Tests your grasp of scope in Vue composables. Great answers contrast module-level refs for global singleton state against function-level refs for per-instance isolation, and explain tradeoffs.
When would you provide an Angular service at the component level?
Tests Angular DI scoping beyond singletons. A strong answer picks stateful reusable widgets, explains providers create one instance per subtree, and notes cleanup on destroy. Red flag: claiming this is for performance without mentioning state isolation.
Explain Svelte Action update and provide a reactive CSS example
Tests Svelte actions beyond initial mount. Strong answers explain update re-runs when parameters change, give a CSS custom properties example, and contrast with destroy. Red flag: suggesting the action re-runs from scratch or using reactive statements.
Explain streaming with Server Components, Suspense, and loading.js
Tests progressive HTML streaming through Suspense boundaries. Strong answers state loading.js auto-wraps a route segment in Suspense so the server can stream the shell instantly and defer slow data without blocking first paint.
How do you implement on-demand revalidation from a CMS webhook?
Tests Next.js cache invalidation and webhook security. Answer: secure Route Handler that calls revalidatePath or revalidateTag; next request rebuilds. Red flag: full redeploys, no secret check, or Server Component revalidate calls.
Dedicated vs Shared vs Service Workers compared
Dedicated worker serves one page for offloading CPU; Shared worker is one instance across same-origin contexts via ports; Service worker is a network proxy for caching and push, event-driven and killable.
CI/CD pipeline for a design system monorepo
Install and cache, then parallel lint, type-check, unit and visual tests, then build, and on main a release job bumps versions and publishes.
How would you use generateStaticParams for known products and on-demand unknowns?
Tests App Router hybrid rendering. Export generateStaticParams for known slugs at build time; leave dynamicParams true so unknown slugs server-render on demand. Red flag: citing Pages Router fallback or ignoring route segment config.
Design a Service Worker caching strategy for a news app
Cache First for the app shell, Stale-While-Revalidate for static assets, and Network First for article APIs.
Driving and measuring design system adoption
Lower friction with migration paths and great docs, incentivize over mandate, and measure adoption via package usage, component coverage, and code analysis.
Zone.js and change detection optimization in Angular?
Zone.js wraps async (timers, events, HTTP), triggering change detection after each; use runOutsideAngular when external libraries fire high-frequency events.
A federated design system governance model
Let the product team own the component as maintainers, with the core team setting standards, reviewing against a checklist, and owning the platform and tokens.
How do you architect Svelte stores to minimize WebSocket re-renders?
Tests Svelte store granularity and subscription semantics. A great answer splits the monolith into domain stores, uses derived selectors to isolate slices, and leverages readable stores to encapsulate the WebSocket source.
How would you use Next.js Middleware to protect /api/admin/* routes?
Match /api/admin/:path*, read the secure cookie, validate the token, return 401 or proceed.
In WebGL, what is the difference between attributes and uniforms?
Tests per-vertex versus per-draw-call data flow. Attributes vary per vertex from buffers; uniforms are constant per draw call. Cite vertex positions as attributes and an MVP matrix as uniform.
How do you implement response streaming in a Next.js Route Handler?
This tests Web Streams API mastery in Next.js. Strong answer: create a ReadableStream with TextEncoder, return it in a Response, and cite AI chat or large JSON as use cases. Red flag: suggesting Node res.write instead of standard Web Streams.
WebRTC signaling: SDP, ICE, and the signaling server
Peers exchange SDP offer and answer describing media via an out-of-band signaling server, then trade ICE candidates to find a network path using STUN and TURN.
How to securely set and read httpOnly cookies in Route Handlers
This tests cookie security across the App Router. A strong answer covers setting httpOnly, Secure, SameSite via NextResponse in a Route Handler, reading with cookies() later, and why document.cookie cannot access it. Red flag: client-side JavaScript access.
We are hiring for this. Every open role lists the topics its interview covers, so you can prepare for the real thing rather than guessing.
See open roles