The final chapter of this series: a collection of typical React interview questions for advanced-level positions – EVERY answer points back to the chapter where we worked through that topic PRACTICALLY on our own project, instead of giving abstract, memorized answers.

"What is the Virtual DOM, and why does React use it?"

A good answer mentions: the Virtual DOM is a lightweight JavaScript object representation of the UI tree, React compares TWO Virtual DOM trees ("diffing"/"reconciliation") to derive MINIMAL real DOM operations, instead of rebuilding the entire DOM on every change. Deep dive: chapter 34.

"What is React Fiber?"

React's internal rendering model since version 16 – enables INTERRUPTIBLE rendering (the render phase) separated from the synchronous DOM update (the commit phase), the foundation for prioritization/concurrent features. A STRONG answer connects this directly to useTransition as a PRACTICAL example. Deep dive: chapter 35, experienced hands-on in chapter 33.

"Why are keys important in lists, and why not use the array index?"

Keys give React a STABLE identity for elements across multiple renders, so local state and DOM nodes stay correctly associated with the RIGHT entity (not the position). The array index as key breaks this on inserting/deleting/reordering in the middle of a list – positions shift, state "jumps" between the wrong elements. Deep dive: chapter 34, with product.sku in our ProductListPage as a running practical example.

"When to use the Context API, when a state management library?"

Context: rare changes, consumers can live with "everyone re-renders on every change" (theme, locale). Zustand/Redux: frequent changes, targeted subscriptions via selectors needed to avoid unnecessary re-renders. A CONVINCING answer demonstrates the re-render problem concretely, the way we proved it ourselves with RenderCounter. Deep dive: chapters 27-29.

"Explain the difference between React.memo, useMemo, and useCallback"

• React.memo: prevents a COMPONENT from re-rendering when props are unchanged.
• useMemo: caches a computed VALUE between renders, as long as dependencies stay the same.
• useCallback: caches a FUNCTION REFERENCE between renders – essentially useMemo specialized for functions.

The BEST answer also explains WHY they're often needed TOGETHER – memo alone accomplishes nothing if an inline function gets passed as a prop (our own trap from chapter 31 with onAddToCart). Deep dive: chapter 31.

"When does useEffect run relative to rendering?"

AFTER commit, not during the (interruptible) render phase – that's why side effects (API calls, DOM measurements, event listeners) must not sit directly in the component body, but belong in useEffect. Deep dive: chapter 35 explains WHY (Fiber's phases), "React for Beginners" chapter 8 explains HOW.

"What do error boundaries NOT catch?"

Event handler errors, asynchronous errors (setTimeout, promises), server-side rendering errors, errors inside the error boundary ITSELF. A good answer also mentions WHY they have to be written as class components (no hook equivalent for getDerivedStateFromError/componentDidCatch). Deep dive: chapter 39.

"What is a Higher-Order Component, and why are hooks preferred today?"

A function that takes a component and returns an enhanced component. Downsides: "wrapper hell" with multiple combined HOCs, prop name collisions, unclear prop origin. Custom hooks solve the same use cases without these downsides. Deep dive: chapter 36.

"Why is response.json() typed as any in TypeScript, and is that a problem?"

TypeScript simply cannot know at compile time what a remote server actually sends – an API function's return type is a developer assertion, not an automatically verified guarantee. For GENUINE runtime safety, you'd need additional schema validation (e.g. with zod). An answer that KNOWS this boundary comes across as more experienced than one that treats TypeScript as all-powerful. Deep dive: chapter 43.

Bonus: rebuilding a typical live-coding exercise yourself

A common interview task: "Build a component that loads data from an API, shows a loading state, handles errors, and makes the list searchable." You've already built exactly that, multiple times – ProductListPage (chapters 23/24 of "React for Beginners") is practically a complete model solution. Practice rewriting this component from memory WITHOUT looking it up (the structure, not word-for-word) – that's the most realistic preparation for a live-coding interview.

That wraps up "React for Professionals" – from understanding the Context API's limits, through performance tools, React's internal architecture, TypeScript integration, all the way to testing and interview readiness, all worked out directly on the same, continuous produktkatalog-web project that began with "React for Beginners". Congratulations!