Intermediate interview questions in Frontend Dev, page 8
Announcing status messages with ARIA live regions
Use a live region with aria-live polite or role status, ensure it exists in the DOM beforehand, and insert text to trigger announcement.
Would you use a Service or a custom Pipe for currency formatting?
Choose Pipe for declarative syntax; implement PipeTransform with transform(value, ...args); use Intl.NumberFormat; register standalone.
Vue 3 Composables vs Vue 2 Mixins: differences and problems solved
Tests why Vue replaced mixins with composables for stateful logic reuse. Answers cite property collisions, unclear origin, inflexible config, and weak type inference.
How would you create a parameterized Svelte tooltip Action?
It tests your grasp of the Svelte Action lifecycle for reactive parameters. Answer: action takes node and parameter, returns update and destroy, bound as use:tooltip={text}. Using component events instead of the Action API, or omitting update, is a red flag.
How do you implement SSR in Next.js App Router and configure fetch?
Tests App Router static defaults and fetch-driven dynamic rendering. Strong answer: async Server Component awaits fetch with cache no-store or next revalidate zero to force request-time rendering. Red flag: citing getServerSideProps or useEffect data fetching.
Architect reusable form validation in Vue vs Angular
Tests how you encapsulate reactive state across frameworks. Contrast Vue's useForm composable returning refs and lifecycle hooks. Contrast Angular's service exposing a FormGroup via RxJS.
Describe an ideal ISR scenario and configure it in a Server Component
This tests stale-while-revalidate tradeoffs. A strong answer picks a semi-static scenario like a product catalog, then covers the fetch revalidate option or segment-level config. A red flag is confusing ISR with SSR or adding useEffect to a Server Component.
SPA back button: what event fires and how do you handle it?
Tests History API literacy. Strong answer: popstate event, PopStateEvent type, restore UI via event.state, and zero-delay setTimeout for DOM sync. Red flag: confusing popstate with pushState or using hashchange for modern History API routing.
How does Server Component fetching differ from getStaticProps and getServerSideProps?
This tests shifting from page-level fetching to component-level async fetches. Strong answers note async await inside components, zero prop drilling, streaming, and mixed static or dynamic data. Red flag: calling them a simple rename of getServerSideProps.
Automated visual regression testing for components
Render components in known states, capture screenshots, diff against approved baselines in CI, and require human review of differences.
Pass data to a Web Worker and transfer an ArrayBuffer efficiently
Tests postMessage clone versus transferable objects for zero-copy transfer. Good answers note postMessage copies by default, but ArrayBuffer can move via transfer list, neutering the original.
How would you structure client-side data fetching in Next.js?
Tests when client fetching is needed in Next.js App Router. A strong answer marks the component with "use client" and fetches in useEffect or via SWR. It also handles loading, error, and race conditions.
Releasing a breaking Button change with SemVer
Bump the major version, write a changelog and migration guide, deprecate before removing where possible, and communicate clearly.
Describe the Service Worker lifecycle and cache versioning
Tests your grasp of the Service Worker lifecycle and cache versioning. A strong answer sequences register, install, activate, and fetch; notes install precaches assets while activate purges old caches and finalizes takeover.
Bundling a component library for tree-shaking
Ship ES modules, mark sideEffects false, preserve named exports, and externalize peers so consumers tree-shake and code-split.
Explain Network First vs Cache First caching and when to use each
Tests matching caching strategy to asset freshness. Cache First serves static assets from the Cache API, falling back to network. Network First fetches fresh content, falling back to cache offline.
How would you use dynamic import() to lazy-load a component-specific library?
Tests lazy loading and bundle splitting. Good answers call import() inside the component lifecycle, await the module namespace, let the bundler split the chunk, and handle loading and error states. Bad answers put import() at top level, defeating lazy loading.
Classifying a Card change under SemVer
Removing a prop is breaking so the whole release is major, document and migrate, and release the highest applicable level.
Why does an OnPush Angular child not update when its input changes?
Tests OnPush reference equality and manual change detection. Strong answers name: in-place object mutation as the root cause; ChangeDetectorRef.markForCheck or detectChanges to force updates; and Angular Signals as a modern path.
Governance for design system contributions
A clear intake and proposal step, review by core maintainers plus design, and criteria covering accessibility, API consistency, tokens, tests, and docs.
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