What is a Pure Component in React?

Pure Component in React is a component that implements a shallow comparison of props and state to avoid unnecessary re-renders.

Unlike a regular component, which re-renders on any update, PureComponent automatically checks if props or state have changed using shallow comparison. If there are no changes, the render is skipped.

This improves performance, especially in large applications.

Example of using PureComponent:

import React, { PureComponent } from 'react';

class MyComponent extends PureComponent {
  render() {
    return <div>{this.props.text}</div>;
  }
}

Here, if this.props.text does not change (by reference and value), the component will not re-render.

For functional components, the equivalent is React.memo, which wraps the component and performs a similar optimization.