What is Strict Mode in React?

In React, Strict Mode is a feature that enables a set of additional runtime checks and warnings for common pitfalls. When you enable Strict Mode, React provides extra tools for detecting and addressing potential issues early in the development process.

Strict Mode can be enabled for the entire application or for specific parts of it by wrapping the component or root component in <StrictMode>. There is no way to opt out of Strict Mode inside a tree wrapped in <StrictMode>.

import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';

const root = createRoot(document.getElementById('root'));
root.render(
  <StrictMode>
    <App />
  </StrictMode>
);

Strict Mode does not impact the production build, it only runs in development mode. It helps you write better React code and avoid potential problems:

• Detecting bugs found by double rendering in development
• Detecting bugs found by re-running Effects in development
• Warning components with unsafe lifecycles
• Warning about legacy string ref API usage
• Warning about deprecated findDOMNode usage
• Warning legacy context API

By highlighting performance issues and helping to optimize your code, Strict Mode can improve the overall performance of your React application.