Metis

Field note / patterns

publishedupdated 2026-05-04#interview#qa#javascript#react#system-design

Interview Q&A Bank

A senior-to-principal question bank across JavaScript, React, system design, APIs, and behavioral storytelling, organized for active review.

TL;DR

  • Good interview answers are short, structured, and anchored in trade-offs.
  • The goal of a Q&A bank is not memorization; it is faster recall of the right mental models.
  • I organize the questions by topic so I can rotate through runtime, React, architecture, and behavioral prep without context switching too hard.
  • If I cannot answer a question in 2–4 minutes out loud, I treat that as a gap even if I can explain it in writing.

Context

The original resource Q&A bank is useful because it forces active recall. I wanted that same effect in the site, but tied directly to the deeper knowledge pages instead of leaving it as a standalone text file.

The Approach

JavaScript runtime

Q: What is a closure, and what bug does it commonly cause?
Answer frame:

  1. define closure precisely
  2. explain stale capture or memory retention
  3. give a React or async example

Go deeper here:

Q: Predict the output of mixed setTimeout, Promise.then, and queueMicrotask.
Answer frame:

  1. sync work first
  2. drain microtasks fully
  3. next task afterward

Go deeper here:

Q: Why is await inside forEach broken?
Answer frame:

  1. forEach does not await callback promises
  2. explain sequential vs parallel intent
  3. show for...of or Promise.all(map(...))

Go deeper here:

React depth

Q: Why are hooks not allowed inside conditionals?
Answer frame:

  1. hooks are indexed by call order
  2. conditional calls corrupt the hook slot order
  3. connect to reconciler / fiber mental model

Go deeper here:

Q: Why is key={index} dangerous in re-ordered lists?
Answer frame:

  1. keys define identity
  2. index keys shift when order changes
  3. state and focus can land on the wrong row

Go deeper here:

Q: When is useMemo an anti-pattern?
Answer frame:

  1. mention profiling first
  2. cheap computations do not earn memoization
  3. unstable deps can erase the benefit

Go deeper here:

System design and architecture

Q: When would you choose SSR vs CSR vs RSC?
Answer frame:

  1. state the axes: SEO, personalization, TTI, bundle cost, team readiness
  2. map each strategy to its sweet spot
  3. explain what you would choose for the prompt

Go deeper here:

Q: When is module federation the wrong choice?
Answer frame:

  1. small team or simple app
  2. no real deploy-independence need
  3. performance or contract complexity outweighs benefits

Go deeper here:

Q: When should a team stay in a modular monolith instead of moving to microservices?
Answer frame:

  1. no proven scaling or coordination bottleneck yet
  2. boundaries still unclear
  3. service overhead would exceed current pain

Go deeper here:

Behavioral and principal-level questions

Q: Tell me about a time you disagreed with a senior engineer or leader.
Answer frame:

  1. establish the context clearly
  2. frame the disagreement as trade-off reasoning, not ego
  3. explain how alignment was reached
  4. close with the outcome and what changed

Q: How do you influence without direct authority?
Answer frame:

  1. create clarity around the decision
  2. align on constraints and trade-offs
  3. reduce adoption cost for other teams
  4. use documentation, platform leverage, and examples

Q: What makes your work principal-level rather than senior-level?
Answer frame:

  1. broader system boundary
  2. cross-team leverage
  3. longer-lived decisions
  4. operational and organizational impact

Trade-offs

  • A Q&A bank is useful for recall, but it is shallow if I do not also rehearse the deeper linked pages.
  • Practicing too many questions at once can feel productive while keeping weak areas hidden.
  • Behavioral prep improves when the answer framework is structured, but it still needs real stories and numbers.

References