Strict Mode

Throughout this chapter, you have learned a lot about React's internals and various optimization techniques. Not really an optimization technique, but still related, is another feature offered by React called Strict Mode.

You may have stumbled across code like this before:

import React from 'react';
// ... other code ...
root.render(<React.StrictMode><App /></React.StrictMode >);

<React.StrictMode> is another built-in component provided by React. It doesn't render any visual element, but it will enable some extra checks that are performed behind the scenes by React.

Most checks are related to identifying the use of unsafe or legacy code (i.e., features that will be removed in the future). But there are also some checks that aim to help you identify potential problems with your code.

For example, when using strict mode, React will execute component functions twice and also unmount and remount every component whenever...