Зачем нужно размонтирование в React?

Размонтирование — удаление компонента из дерева и DOM — нужно по двум причинам: UI должен отражать актуальное состояние (ушедшее — убрать), и главное — это момент освобождения ресурсов.

Когда происходит

• Условный рендеринг: {isOpen && <Modal />} — isOpen стал false;
• навигация: смена маршрута размонтирует старую страницу;
• удаление элемента списка;
• смена key или типа элемента (пересоздание).

Зачем это критично: очистка ресурсов

Компонент за время жизни обрастает «хвостами»: таймеры, подписки, соединения, глобальные слушатели. Без очистки при размонтировании они продолжают жить:

• утечки памяти (замыкания держат объекты);
• «зомби»-обработчики дёргают setState несуществующего компонента (лишняя работа, гонки);
• накапливающиеся дубли: смонтировали чат три раза — три WebSocket-соединения.

useEffect(() => {
  const socket = connect(roomId);
  const timer = setInterval(ping, 30000);

  return () => {        // выполняется при размонтировании
    socket.close();
    clearInterval(timer);
  };
}, [roomId]);

В классах то же — componentWillUnmount.

Ещё роль: сброс состояния

Размонтирование уничтожает state компонента. Это используется намеренно: смена key (<Form key={userId} />) пересоздаёт компонент с чистым состоянием — декларативный способ «сбросить всё».

Проверка корректности

StrictMode (dev) монтирует компоненты дважды (mount → unmount → mount) именно чтобы выявить эффекты без честной очистки.

Коротко для собеседования

Размонтирование убирает неактуальный UI и — главное — освобождает ресурсы: cleanup-функции эффектов (componentWillUnmount в классах) закрывают таймеры, подписки, соединения; иначе утечки и «зомби»-обработчики. Побочная роль — сброс state, в том числе намеренный через смену key.