Significant lag in dispatching events with Redux Saga

Question

I seem to be encountering a very similar problem to the one discussed in this thread regarding a lag when dispatching actions.

I tried using redux-perf-middleware to benchmark the time between actions and here is what I am repeatedly running into:

Action with type "API_CALL_FIRED" took 0.10 milliseconds.

Action with type "APP_STATE_UPDATED" took 309.50 milliseconds.

Please ignore the generic naming for the actions. Just placeholders.

I'm at a loss as to why there is such a delay between API_CALL_FIRED and the worker being called via an actionChannel.

Note: When not using an actionChannel this is not an issue. There is no noticeable lag.

Is there something amiss with the way I have actionChannel configured? I tried removing redux-logger but that made almost no difference in benchmarks.

Action:

export const dataRequested = (startIndex, pageSize) => {
  return {
    type: API_CALL_FIRED,
    startIndex,
    pageSize
  };
};

Watcher:

export function* watchRequests() {
  const requestChannel = yield actionChannel(API_CALL_FIRED);
  while (true) {
    const { startIndex, pageSize } = yield take(requestChannel);
    yield call(handleRequest, startIndex, pageSize);
  }
}

Worker & Helper fn:

const fetchData = url => {
  return axios(url).then(res => res.data);
};

export function* handleRequest(startIndex = 0, pageSize = 50, channel = false) {
  const endpointUrl = '...'; // excluded in this example

  const data = yield call(fetchData, endpointUrl);

  try {
    yield put({ type: APP_STATE_UPDATED, data });
  } catch (error) {
    yield put({ type: API_CALL_ERROR, error });
  }
}

Reducer:

const reducer = (state = initialState, action) => {
  switch (action.type) {

    case APP_STATE_UPDATED:
      return { ...state, data: action.data };

    default:
  }

  return state;
};