В чем разница между PureComponent и обычным компонентом

PureComponent автоматически реализует shouldComponentUpdate с поверхностным сравнением пропсов и состояния. Обычный Component всегда ререндерится при изменении пропсов или состояния, если не переопределить shouldComponentUpdate вручную.

Пример:

// Обычный компонент - ререндерится всегда
class NormalComp extends React.Component {
  render() {
    return <div>{this.props.value}</div>;
  }
}

// PureComponent - ререндерится только при изменении пропсов/состояния
class PureComp extends React.PureComponent {
  render() {
    return <div>{this.props.value}</div>;
  }
}

Ключевые отличия:

1. PureComponent делает shallow compare пропсов и состояния
2. Не используй PureComponent если пропсы/состояние часто меняются на новые объекты/массивы
3. Для функциональных компонентов аналог - React.memo