React.memo() Optimization

React’s React.memo() is a higher-order component that helps optimize the performance of functional components by preventing unnecessary re-renders.

🧠 How React.memo() Works:

• React.memo() performs a shallow comparison of the component’s props and prevents re-renders if the props have not changed.

Usage Example:

javascript
1const MyComponent = React.memo((props) => {
2  return <div>{props.name}</div>;
3});

🧠 When to Use React.memo():

• Use React.memo() for pure components that receive props and don't need to re-render unless the props change.

• Important: It does a shallow comparison, so complex objects as props might require additional optimization.

In short:

React.memo() optimizes performance by avoiding unnecessary re-renders of functional components when their props haven’t changed.