🚀 3 Tricky React Interview Questions Asked in Top Companies These are NOT your typical “what is useState?” questions. These are the ones that actually test your real understanding of React 👇 ⸻ 1️⃣ Why does a component re-render even with React.memo? You wrapped a child with React.memo. Props look the same… but it still re-renders. 👉 Reason: React.memo does shallow comparison 👉 Objects, arrays, and functions create new references every render 💡 Fix: Use useMemo / useCallback to stabilize references ⸻ 2️⃣ Why is useEffect running twice in development? You used an empty dependency array, still it runs twice 🤯 👉 This is NOT a bug 👉 It’s React Strict Mode (React 18+) 💡 React intentionally mounts → unmounts → mounts again to detect side effects & bugs early ✅ Happens only in development, not in production ⸻ 3️⃣ Why is state not updating inside async functions? You update state, but inside setTimeout or async code it still shows the old value 😵 👉 Reason: Stale closures (JavaScript behavior) 💡 Fix: ✔️ Use functional updates → setState(prev => prev + 1) ✔️ Or useRef for latest value ⸻ 🎯 Interview Tip: Use these keywords to stand out: ✔️ Shallow comparison ✔️ Reference equality ✔️ Strict Mode behavior ✔️ Stale closures #ReactJS #FrontendDeveloper #WebDevelopment #JavaScript #InterviewPrep #ReactInterview #Coding #interview #prepration #Developer
React Interview Questions: Shallow Comparison, Strict Mode & Stale Closures
More Relevant Posts
-
Preparing for a Mid Level React Interview? Here’s another set of questions: => What is reconciliation in React and how does it work? => How does React decide when to re render components? => What is the Virtual DOM and how is it different from the real DOM? => How does it improve performance? => What are keys in React and why are they important? => What issues can arise from using index as a key? => What is prop drilling and how do you avoid it? => What are better alternatives? => How do you handle side effects in React applications? => What are common mistakes with useEffect? => What is code splitting and how do you implement it in React? => When should you use lazy loading? => What are custom hooks? => How do you design reusable hooks? => What is the difference between controlled and uncontrolled side effects? => How do you manage cleanup in components? => How do you handle error boundaries in React? => What are their limitations? => What is hydration in React? => When does it matter? => How do you manage forms in large scale applications? => What libraries or approaches would you use? => What is the difference between client side rendering and server side rendering? => What are the trade offs? => How do you optimize bundle size in a React app? => What tools would you use to analyze it? => What are common performance bottlenecks in React apps? => How do you identify and fix them? => How do you manage state synchronization between multiple components? => What challenges have you faced? => How do you handle race conditions in API calls in React? => How do you cancel stale requests? => How do you structure reusable and maintainable component libraries? => What patterns do you follow? #ReactJS #FrontendDevelopment #TechInterviews #JavaScript #WebDevelopment #Developers
To view or add a comment, sign in
-
Frontend Interview Experience – A Small but Interesting Redux Debate Recently attended a frontend interview where the discussion covered HTML, CSS, JavaScript, React, GraphQL, and Microfrontends. During the React round, I was asked about the core pillars of Redux. I explained: • Store – holds the application state • Actions – plain JavaScript objects describing what happened • Reducers – pure functions that return the new state • Dispatch – sends actions to the store • Selectors – used to read data from the store Then came an interesting moment The interviewer mentioned that "Actions are functions, not objects." I respectfully shared my understanding that: In Redux, an Action is a plain JavaScript object with a mandatory type field. After the interview, I double-checked — and yes, Redux defines actions as plain objects. The likely confusion: What the interviewer referred to was Action Creators, which are functions that return action objects. Example: const addTodo = (text) => ({ type: "ADD_TODO", payload: text }); Key takeaway: • Action = Object • Action Creator = Function 🎯 Interviews are not just about right or wrong — they’re about clarity of concepts and communication. Curious to know — have you ever faced a situation where both perspectives were technically correct but misunderstood in interviews? #Frontend #React #Redux #JavaScript #InterviewExperience #Learning
To view or add a comment, sign in
-
🚀 React Interview Question Breakdown – Can You Spot the Issues? Recently, I came across some interesting React interview questions focused on debugging and code optimization. Sharing them here 👇 🔍 Question 1: Find the issues and fix them const items = useSelector(state => state.items); const [filtered, setFiltered] = useState(items); useEffect(() => { setFiltered(items.filter(i => i.name.includes(search))); }, []); 🔍 Question 2: Find the issues and fix them const handleLike = async () => { const newCount = likes + 1; setLikes(newCount); await api.updateLikes(newCount); if (condition) { setLikes(likes + 1); // Review point } }; #ReactJS #FrontendDevelopment #JavaScript #WebDevelopment #InterviewQuestions #ReactHooks
To view or add a comment, sign in
-
🔥 Frontend Interview Questions You MUST Know 1️⃣ What are the component lifecycle methods in class components and how are they handled in functional components? 2️⃣ Walk me through controlled vs uncontrolled components in React. 3️⃣ Can you explain event delegation in JavaScript with an example? 4️⃣ What are closures in JavaScript? What are their advantages and disadvantages? 5️⃣ How do memory leaks happen in frontend applications? How can you prevent them? 6️⃣ What is garbage collection in JavaScript? Can you explain the Mark and Sweep algorithm? Comment your answers below or save this post to revise later before your next interview! Let’s learn together 🚀 #FrontendDeveloper #JavaScript #ReactJS #InterviewPreparation #FrontendInterview #WebDevelopment #Frontend #ReactDeveloper
To view or add a comment, sign in
-
Preparing for a Mid Level React Interview? Start with these questions: => How does React’s rendering process work? => What causes unnecessary re renders and how do you prevent them? => What’s the difference between state and props? => When should you lift state up? => How do you manage complex state in an application? => When would you use useState vs useReducer? => What are hooks, and why were they introduced? => How do useEffect dependencies work? => Have you ever faced an infinite re render issue? How did you fix it? => What is memoization in React? => When would you use React.memo, useMemo, and useCallback? => How do you handle API calls in React? => How do you manage loading, error, and success states? => How do you structure a scalable React application? => How do you manage shared state across components? => Context API vs Redux, when would you use each? => How do you optimize performance in React apps? => What tools do you use to debug performance issues? => What are controlled vs uncontrolled components? => When would you use refs? => How do you handle forms and validations? => How do you secure a React application? => How do you test React components? => Tell me about a complex UI you built => How did you improve performance in a React app? => What was the hardest bug you fixed in React? #ReactJS #FrontendDevelopment #TechInterviews #JavaScript #WebDevelopment #Developers
To view or add a comment, sign in
-
Preparing for a Mid Level React Interview? Start with these questions: => How does React’s rendering process work? => What causes unnecessary re renders and how do you prevent them? => What’s the difference between state and props? => When should you lift state up? => How do you manage complex state in an application? => When would you use useState vs useReducer? => What are hooks, and why were they introduced? => How do useEffect dependencies work? => Have you ever faced an infinite re render issue? How did you fix it? => What is memoization in React? => When would you use React.memo, useMemo, and useCallback? => How do you handle API calls in React? => How do you manage loading, error, and success states? => How do you structure a scalable React application? => How do you manage shared state across components? => Context API vs Redux, when would you use each? => How do you optimize performance in React apps? => What tools do you use to debug performance issues? => What are controlled vs uncontrolled components? => When would you use refs? => How do you handle forms and validations? => How do you secure a React application? => How do you test React components? => Tell me about a complex UI you built => How did you improve performance in a React app? => What was the hardest bug you fixed in React? #ReactJS #FrontendDevelopment #TechInterviews #JavaScript #WebDevelopment #Developers
To view or add a comment, sign in
-
Mastering REACT.JS isn't about writing code it's about understanding the concepts that power modern web applications. We've put together a list of the 50 React.js interview questions. They cover: * The basics of React like JSX and Virtual DOM * State versus Props * topics, such as Hooks and Context API * Redux and performance optimization techniques * What to expect in a real-world interview This guide is for anyone who wants to learn React whether you're a student, a developer who wants to improve their skills or someone who is preparing for a job interview. It can help you feel more confident and clear, about React. Save this guide. Practice every day to stay ahead. Which React concept do you find difficult to understand? Lets talk about it! #ReactJS #WebDevelopment #Frontend #Coding #InterviewPrep #SoftwareEngineering #Developers #TechCareers #HNAYASKILLS #LearnToCode #PlacementPreparation
To view or add a comment, sign in
-
🚀 React JS Interview Questions You Should Prepare in 2026 If you're preparing for a frontend role, especially in React, these are the questions you’ll most likely face 👇 🧠 Core React Concepts ✔ What is Virtual DOM and how does it work? ✔ Difference between state and props? ✔ What are hooks and why are they used? ✔ Explain component lifecycle ⚛️ Hooks (Very Important) ✔ What is useState and useEffect? ✔ When does useEffect run? ✔ What are custom hooks? ✔ Difference between useMemo and useCallback 🔄 State Management ✔ When to use Context API vs Redux? ✔ How does Redux work internally? 🌐 API & Async Handling ✔ How do you fetch data in React? ✔ How do you handle loading & error states? ⚡ Performance Optimization ✔ What is lazy loading? ✔ What is memoization in React? ✔ How to avoid unnecessary re-renders? 🧪 Testing ✔ How do you test React components? ✔ Have you used Jest? 🚀 Advanced (Stand Out Questions) ✔ What are Server Components in Next.js? ✔ Difference between CSR, SSR, and SSG? ✔ How does reconciliation work? 💡 Real Interview Tip: Don’t just answer theory. 👉 Always explain with a real project example 🔥 Pro Tip: If you can confidently answer these, you're already ahead of 70% of candidates. 💬 What’s the toughest React question you’ve faced in an interview? #ReactJs #FrontendDevelopment #WebDevelopment #JavaScript #TechInterviews #SoftwareEngineering #Developers #CareerGrowth #NextJS #CodingInterview
To view or add a comment, sign in
-
❓ React Interview Question: useCallback vs useMemo in React When building React applications, unnecessary re-renders and expensive computations can impact performance. This is where hooks like useCallback and useMemo help optimize rendering efficiency. 🔹 useCallback Used to memoize a function, so it doesn’t get recreated on every render. This is especially useful when passing functions to child components to prevent unwanted re-renders. 🔹 useMemo Used to memoize a computed value, avoiding expensive recalculations unless dependencies change. 👉 Follow Tarun Kumar for tech content, coding tips, and interview prep 🚀 #ReactJS #ReactHooks #ReactInterviewQuestions #FrontendDevelopment #JavaScript #WebDevelopment #CodingInterview #SoftwareEngineering #TechTips #LearnToCode
To view or add a comment, sign in
-
-
🚀 ReactJS Interview Breakdown — Topic-Wise Questions You MUST Prepare 👇 Just completed a strong technical round, and here’s a structured breakdown of questions asked topic-wise 👇 --- 🧠 JavaScript (Core Concepts) - What is the Event Loop? How does async execution work? - Output-based questions: - "10 > 9 > 8" → why? - Array ".push()" return value behavior - Type coercion and comparison logic --- ⚛️ ReactJS - How does rendering work in React? - What is the role of "useEffect"? (dependency array, cleanup) - Difference between "useMemo" and "useCallback" - When do unnecessary re-renders happen? --- 🧭 React Router - Difference between "useNavigate" and "useLocation" - When to use each in real scenarios --- 🔄 State Management (Redux) - Redux vs Redux Toolkit - What is Store vs State? - What does store actually contain? --- 🌐 API Handling - What are Axios Interceptors? - Where have you used them in real projects? - Handling auth tokens & global error handling --- 💻 Coding Questions - Find starting index of substring (case-sensitive & insensitive) - Find ALL occurrences of a word - Handle edge cases (ignore punctuation like ".", "!") - Group array of objects → "{ age: [names] }" - Write polyfill for "Array.prototype.filter" - Merge two arrays and sort (without inbuilt methods) --- 🔥 What they really evaluate - Problem-solving approach - Edge case handling - Clean and optimized code - Real-world experience over theory --- 💡 If you’re preparing for React interviews: 👉 Focus on concept clarity + coding + real use cases --- Drop a 🔥 if you want: - Answers to these questions - Machine coding patterns - Last-minute revision sheet #ReactJS #JavaScript #FrontendInterview #Redux #CodingInterview #WebDevelopment
To view or add a comment, sign in
Explore related topics
- Advanced React Interview Questions for Developers
- Backend Developer Interview Questions for IT Companies
- Front-end Development with React
- Sharp Questions to Ask in Interviews
- Common Questions in Recruiter Interviews
- How to Run Transparent Developer Interviews
- Common Coding Interview Mistakes to Avoid
- How to Answer the "Why You?" Interview Question
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development