Intermediate interview questions in Frontend Dev, page 11
How do you type a custom property on global window in TypeScript?
Tests declaration merging and global scope augmentation in TypeScript. Strong answer: declare global in a .ts file, a .d.ts with interface Window, or scoped declare const window. Red flag: any or ts-ignore instead of interface merging.
localStorage vs httpOnly cookie for auth tokens
LocalStorage is JS-readable so XSS steals it; httpOnly cookies are JS-invisible blocking XSS theft but exposed to CSRF, mitigated by SameSite and tokens.
Structuring docs for multiple audiences
Layer docs by audience, give developers API and code, designers usage and design guidelines, PMs principles and coverage, with shared foundations like tokens and accessibility.
How do you create a POST API endpoint in SvelteKit?
Add a +server.js file in a src/routes subdirectory, export a POST handler returning a Response, and note that +server files never run in the browser.
How do you derive a PATCH payload type from UserProfile?
Tests knowledge of TypeScript utility types for APIs. A great answer uses Partial<UserProfile> to make all fields optional in one line and connects it to PATCH subset semantics. Red flag: manually rewriting properties as optional or confusing PUT with PATCH.
Session auth in Next.js with API routes and middleware
Login route sets a signed httpOnly cookie, middleware validates the session at the edge and redirects, server components read the session.
Cross-platform themeable token system
Tier tokens with semantic theme sets that remap primitives per mode, transform to each platform's theme mechanism, and deliver versioned packages.
Explain server.ts and main.ts in Angular Universal
Server.ts SSRs initial HTML via Node/Express; main.ts bootstraps the browser app and hydrates the DOM. First request hits the server; later navigations are client-side only.
What is the exact output and event sequence of this code?
Tests event loop priority between sync, microtasks, and macrotasks. A strong answer gives Start, End, Promise, Timeout; explains Promise.then is a microtask and setTimeout is a macrotask, microtasks draining before the next macrotask.
What problem do CSS Cascade Layers solve?
Layers create explicit priority bands, layer order beats specificity inside, and you control override without selector hacks.
Explain the difference between microtask and macrotask queues
Macrotasks like setTimeout run one per tick; microtasks like Promises drain fully after each task before rendering.
How do you handle user-specific content on a getStaticProps page?
Tests the static generation boundary. A strong answer serves a static shell, then hydrates user state client-side via useEffect or SWR. Red flag: claiming getStaticProps can read cookies at build time.
Structure CSS layers for reset, vendor, and components
Declare layer order upfront, place reset earliest, vendor next, your components last so they win.
How does Angular's Zone.js change detection differ from Vue and Svelte reactivity?
Tests granular reactivity architecture. Angular Zone.js monkey-patches async to scan the full component tree; Vue uses runtime Proxy tracking; Svelte compiles runes into targeted DOM bindings.
Optimize a canvas with thousands of moving objects
Tests GPU-bound vs CPU-bound bottleneck diagnosis. Strong answers: batch draw calls to cut JS-to-GPU overhead, and render to a smaller back buffer to reduce fill-rate cost.
Describe a robust automatic token refresh strategy in a React SPA
This tests token rotation without UX interruption in SPAs. Use HttpOnly cookies for refresh tokens, in-memory access tokens, an interceptor with a promise lock, and proactive background refresh.
Center a div with Flexbox on the parent
Set display flex on parent, justify-content center for the main axis, align-items center for the cross axis.
How do Vue, Angular, and Svelte handle deep prop mutation re-rendering?
Vue and Svelte detect nested mutations via Proxies; Angular default re-renders via Zone.js, but ngOnChanges misses it since the reference is unchanged.
Type a compose function using generics and overloads
It tests your ability to type higher-order pipelines where each function's output feeds the next input. Use function overloads with chained generics for each arity so TypeScript infers the composed parameter and return types.
CSS Modules versus BEM for encapsulation
CSS Modules scope via build-time hashed class names automatically; BEM scopes via disciplined human naming with no tooling.
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