React / Memo: Wrapping all the functional components with React.memo

Question

Thanks to React hooks, we started developing all the components as functional components. But we miss the PureComponent which avoided unnecessary rerenders. We used to create every component extending PureComponent.

My questions are: Shall we just blindly wrap all our functional components with React.memo? Will it slow down or affect the application in any way? Is there any situation where we should not wrap the functional components with React.memo?

Answer 1

Yes, React.memo, PureComponent and shouldComponentUpdate for classes can all have a negative performance effect as they carry a small calculation cost, so if you know your component is not a pure component you should be careful in how and when you use them.

Answer 2

The following links has the answer to my question.

https://dmitripavlutin.com/use-react-memo-wisely/

https://github.com/facebook/react/issues/14463