Advanced

Common interview patterns

• Explain Fiber's work loop and how reconciliation walks the tree
• Diagnose a hydration mismatch and propose the fix
• Trace why an effect double-fires under StrictMode in development
• Walk through how `useTransition` and `useDeferredValue` change rendering priority

Common mistakes

• Assuming `setState` inside a Promise batches the same as inside an event handler (pre-React 18 it didn't)
• Misreading StrictMode's double-render as a real bug instead of a dev-mode mount/unmount/mount
• Reading state inside a stale closure and assuming React 'lost' the value
• Skipping the dependency array on `useEffect` and creating an infinite loop

Common interview patterns

• Virtualize long lists with `react-window` or a custom windower
• Stabilize callback identity with `useCallback` — only when the consumer is memoized
• Profile with the React Profiler to confirm a render is the bottleneck
• Split context to avoid full-tree re-renders on every change

Common mistakes

• Wrapping every component in `React.memo` without measuring — adds overhead without payoff
• Memoizing with deps that change every render (new object/array literal)
• Virtualizing a list of 50 items where a key fix would have been enough
• Putting frequently-changing values in a context that many consumers subscribe to

Common interview patterns

• Test behavior with RTL queries (`getByRole`) instead of implementation details
• Mock the network at the boundary with MSW, not at the fetch call
• Cover critical user flows in E2E, edge cases in unit
• Snapshot only stable, intentional output — never large trees

Common mistakes

• Querying by `data-testid` when an accessible role would do
• Mocking React itself or RTL internals to make a test pass
• Writing E2E tests for logic that a unit test could cover in 10ms
• Snapshotting everything and treating diffs as 'just update the snapshot'

Common interview patterns

• Store auth tokens in HttpOnly, Secure, SameSite cookies — never localStorage
• Sanitize user input at render, not just at submit; trust no string from the network
• Use CSP with nonces to lock down inline scripts
• Defend against CSRF with same-site cookies + a CSRF token on state-changing requests

Common mistakes

• Storing JWTs in localStorage 'because it's easier'
• Trusting `target="_blank"` without `rel="noopener noreferrer"`
• Relying on framework escaping alone for `dangerouslySetInnerHTML`
• Treating CORS as a security boundary (it's a browser policy, not server auth)

Common interview patterns

• Prefer semantic HTML (`<button>`, `<dialog>`) over ARIA-on-div
• Trap focus inside modals and restore on close
• Announce live regions for dynamic content (toasts, errors)
• Test with keyboard-only navigation and a screen reader, not just axe

Common mistakes

• Using `<div onClick>` instead of `<button>` and losing keyboard + screen reader support
• ARIA-labeling a button that already has a visible label (duplicate announcement)
• Forgetting to update `aria-live` regions when async content arrives
• Relying on color alone to convey state