Interviews are like open-book exams where the book is in your brain — and sometimes, mind blanked out. 😅
After 7+ years in frontend, I thought I’d seen it all… until these React.js questions made me pause.
I’m sharing them with clear explanations so you don’t get stumped like I did. Let’s go! 👇
1. 🔄 What's the difference between useEffect(() => {}, []) and useLayoutEffect(() => {}, [])?
Hint: Timing matters.
✅ useEffect runs after the DOM paints.
✅ useLayoutEffect runs before paint — can block rendering.
Use useLayoutEffect only when DOM measurement or mutation is needed.
2. 🧠 Why is key prop important in lists?
It helps React identify which items changed, are added, or removed. Without a key, React may re-render unnecessarily.
3. ⚡ Can you explain React reconciliation?
React compares the new virtual DOM with the previous one. It tries to minimally update the actual DOM using keys and diffing.
4. 🌀 What is a closure, and how can it cause bugs in React hooks?
Closures remember variable states. In hooks, outdated closures can cause stale state bugs, especially in setInterval or event handlers.
5. ❓ What's the difference between controlled and uncontrolled components?
-
Controlled: React manages the input state (
value,onChange) -
Uncontrolled: DOM handles it via
ref
6. 🧪 How would you test a component using React Testing Library?
Use:
render(<MyComponent />);
expect(screen.getByText(/hello/i)).toBeInTheDocument();7. 🚀 What is code-splitting, and how do you implement it in React?
Using React.lazy() and Suspense to load components only when needed, improving performance.
8. ⚙️ What happens if you update state inside useEffect?
It can cause re-renders. Be cautious of infinite loops if dependencies aren't correctly defined.
9. 🛑 What are some common mistakes with useState?
Initial value not set correctly
Forgetting it’s async
Updating state based on current state without using callback form:
setCount(prev => prev + 1);
10. 👻 Why do people still use Redux if we have Context API?
Redux offers predictable state, middleware support, and better dev tools. Context is fine for low-frequency updates, but not large-scale state.
💡 Final Thought
Interviews test your thinking more than just syntax. These questions helped me level up, and I hope they help you too.
What’s the trickiest React question you’ve faced? Drop it below! ⬇️