Почему reducer должен быть чистой функцией?

Почему reducer должен быть чистой функцией?

В Redux reducer — это функция, которая принимает текущее состояние и действие, и возвращает новое состояние. Требование чистоты означает, что reducer не должен изменять переданное состояние напрямую, не должен выполнять побочные эффекты (запросы к API, мутации DOM, вызовы setTimeout) и должен возвращать новый объект состояния, а не модифицировать старый.

Основные причины

• Предсказуемость: Чистая функция всегда возвращает одинаковый результат для одинаковых входных данных. Это позволяет легко отслеживать изменения состояния и воспроизводить ошибки.
• Тестируемость: Чистые функции легко тестировать — не нужно создавать сложные моки или окружение.
• Воспроизводимость: Redux DevTools могут записывать и воспроизводить последовательности действий, потому что reducer не имеет скрытых зависимостей.
• Оптимизация: React может эффективно сравнивать предыдущее и новое состояние (shallow comparison) для принятия решения о перерисовке.

Пример

// Неправильно: мутация состояния
function badReducer(state, action) {
  state.count += 1; // мутация
  return state;
}

// Правильно: возвращаем новый объект
function goodReducer(state, action) {
  return { ...state, count: state.count + 1 };
}

В первом случае React может не заметить изменения, так как ссылка на объект осталась той же. Во втором — создаётся новый объект, и React корректно обновляет UI.

Вывод

Чистота reducer — это не просто правило, а фундаментальный принцип, обеспечивающий надёжность и предсказуемость управления состоянием. Применяйте чистые функции везде, где требуется детерминированное преобразование данных, особенно в Redux и других Flux-подобных архитектурах.