Interview questions in Frontend Dev, page 24
Hydration: SSR HTML to interactive app?
Server renders HTML, client JavaScript bootstraps and attaches event listeners (hydration), mismatch occurs if server HTML differs from client render.
Delivering an urgent design system hotfix
Branch from the released tag, apply a minimal fix, add a regression test, ship a patch version, then forward-port to main.
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.
Would you use getServerSideProps or getStaticProps for private user data?
Tests SSR vs SSG privacy. Use getServerSideProps: it runs per-request with auth cookies. getStaticProps bakes HTML/JSON at build time, leaking private data across users. Red flag: suggesting ISR or revalidation for authenticated data.
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.
Compare SSR, SSG, and ISR trade-offs in meta-frameworks
What it tests: matching rendering modes to build time, freshness, and scale. Outline: contrast SSR per-request cost with SSG fast CDN delivery but stale content and long builds, then show ISR as lazy regeneration post-deploy.
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.
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