Какие знаешь Middleware для Redux

«Какие знаешь Middleware для Redux» — вопрос из категории Библиотеки, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

Redux Middleware — это прослойка между dispatch и reducer, позволяющая перехватывать и обрабатывать действия. Основные варианты:

  1. redux-thunk
    Позволяет dispatch асинхронных функций вместо объектов.
    const fetchData = () => async (dispatch) => {
      dispatch({ type: 'FETCH_START' });
      const data = await api.getData();
      dispatch({ type: 'FETCH_SUCCESS', payload: data });
    };
  1. redux-saga
    Работает на генераторах, подходит для сложных асинхронных сценариев (например, race, debounce).
    function* watchFetchData() {
      yield takeEvery('FETCH_REQUEST', fetchDataSaga);
    }
  1. redux-observable
    Использует RxJS для обработки side effects через эпики (подходит для стримов событий).

  2. redux-logger
    Логирует действия и состояние до/после редьюсера (удобно для дебага).

  3. custom middleware
    Можно написать свой, например, для валидации или модификации actions.

Выбор зависит от сложности проекта: thunk — для простых случаев, saga/observable — для сложных асинхронных потоков.