Можно ли обернуть в memo всё приложение целиком?

Что такое React.memo и как он работает

React.memo — это функция высшего порядка, которая мемоизирует результат рендеринга компонента. Она сравнивает предыдущие и новые пропсы (поверхностно) и, если они не изменились, возвращает закешированный результат, предотвращая ререндер. Это полезно для компонентов, которые часто получают одни и те же пропсы и рендерят тяжелые поддеревья.

Почему нельзя обернуть всё приложение

Корневой компонент приложения обычно содержит состояние (например, через useState, useReducer или глобальный стейт-менеджер). При каждом изменении состояния корневой компонент получает новые пропсы или обновляется сам, поэтому React.memo не сможет предотвратить его ререндер. Более того, сравнение пропсов на верхнем уровне добавляет лишние вычисления без пользы. Пример:

const App = () => {
  const [count, setCount] = useState(0);
  return (
    <div>
      <button onClick={() => setCount(c => c + 1)}>Click</button>
      <ExpensiveChild />
    </div>
  );
};

export default React.memo(App); // Бесполезно, так как App ререндерится при изменении count

Где и как применять React.memo

React.memo стоит использовать для компонентов, которые:

• Рендерятся часто, но получают стабильные пропсы (например, простые презентационные компоненты).
• Содержат тяжелые вычисления или большие поддеревья.
• Не зависят от контекста или глобального состояния, которое часто меняется.

Пример правильного использования:

const ListItem = React.memo(({ item }) => {
  return <li>{item.name}</li>;
});

const List = ({ items }) => {
  return (
    <ul>
      {items.map(item => <ListItem key={item.id} item={item} />)}
    </ul>
  );
};

В этом случае ListItem не будет ререндериться, если его конкретный item не изменился.

Вывод

React.memo — это инструмент точечной оптимизации, а не универсальное решение. Оборачивать всё приложение неэффективно и может привести к обратному эффекту. Используйте его только для компонентов, где он действительно приносит пользу, и всегда профилируйте производительность перед и после внедрения.