What does React.StrictMode do?
StrictMode is a development-only wrapper that helps find bugs. It renders components twice, re-runs effects once after mount and warns about deprecated APIs. It has no effect and no cost in production builds.
Explain it simply
StrictMode is a strict examiner during practice tests. It deliberately asks the same question twice to see whether your answers change. If a component gives different output on the second render, it was not pure.
In development it does three useful things. It calls component bodies and reducers twice to expose impure code, it runs each effect's setup, cleanup and setup again to expose missing cleanups, and it warns about legacy APIs.
None of this happens in production. So if a console.log prints twice locally, that is expected, and the fix for a real bug is to make the code correct, not to remove StrictMode.
Example
import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
createRoot(document.getElementById("root")).render(
<StrictMode>
<App />
</StrictMode>
);Frameworks such as Next.js enable it by default in new projects.
What to say in the interview
"StrictMode is a development tool that double-invokes renders and effects to reveal impure rendering and missing cleanups. It does nothing in production. Seeing logs twice in dev is normal, and I fix the underlying issue rather than disabling it."
Common mistakes
- Removing StrictMode when a double effect shows a bug.