DEV Community

Jenish Dabhi
Jenish Dabhi

Posted on

20 Rapid-Fire React Client Questions + Ideal Answers

1️⃣ What triggers a re-render?
State change, prop change, or parent re-render.

2️⃣ What is reconciliation?
React’s process of comparing previous and current virtual DOM to update minimal real DOM.

3️⃣ Difference between useMemo and useCallback?
useMemo memoizes values, useCallback memoizes functions.

4️⃣ What is React.memo?
HOC that prevents re-render if props don’t change.

5️⃣ How do you handle API caching?
Using TanStack Query or custom caching with stale time strategy.

6️⃣ What causes memory leaks in React?
Uncleaned subscriptions, timers, event listeners, or unresolved async calls.

7️⃣ How do you cancel API requests?
Using AbortController inside useEffect cleanup.

8️⃣ What is code splitting?
Loading parts of the application lazily instead of bundling everything together.

9️⃣ How do you optimize forms?
Debounce inputs, controlled components carefully, avoid re-rendering entire form.

🔟 What is hydration?
Attaching event listeners to server-rendered HTML.

1️⃣1️⃣ What is stale closure?
When a function captures outdated state due to missing dependencies.

1️⃣2️⃣ How do you debug performance?
React DevTools Profiler + Chrome Performance tab.

1️⃣3️⃣ What is prop drilling?
Passing props through multiple layers unnecessarily.

1️⃣4️⃣ How do you avoid prop drilling?
Context API or state management libraries.

1️⃣5️⃣ When would you use Redux over Context?
When app has complex state logic, middleware, or needs devtools/time-travel debugging.

1️⃣6️⃣ What is key in list rendering?
Unique identifier that helps React track elements during reconciliation.

1️⃣7️⃣ What is Suspense?
Mechanism to handle async rendering and lazy loading.

1️⃣8️⃣ What is Concurrent Rendering?
React’s ability to interrupt rendering for better responsiveness.

1️⃣9️⃣ What is Tree Shaking?
Removing unused code during build.

2️⃣0️⃣ What is optimistic UI?
Updating UI before server confirms success for better UX.

Top comments (0)