Redux Saga + Socket lags

Question

I am learning Redux-Saga and faced such a problem.

I have a socket that sends me 40+ messages per second in real time. This is written to the Store via yield put, and as I understand it, the data does not have time to be written, as new ones are already arriving - which causes terrible lags.

If you do not process all messages from the socket, then there are no lags.

Tell me how to solve this issue?

Here's a sample code if needed:

Socket

socketOnmessage (pipe) {
  const data = yield take (channel);
  
  while (true) {
    yield put ({
      type: UPDATE_TABLE,
      payload: data,
    });
}

In reducer

types of cases. UPDATE_TABLE:
      return [... state, {... payload}]. splice (-80);

Answer 1

It's hard to tell without understanding the plumbing in terms of how the socketOnmessage is triggered and how things are supposed to work, but the while (true) { loop is almost certainly incorrect. Basically after a successful take, the infinite loop is started and yield put is called over and over as fast as possible forever without stopping which will certainly make your app lag.

At the very least the take should be inside the infinite loop so put is only called once per take:

socketOnmessage (pipe) {
  while (true) {
    const data = yield take (channel);
    yield put ({
      type: UPDATE_TABLE,
      payload: data,
    });
}

That said something else seems off since socketOnmessage should be a generator function in order to call yield, which it is not in your sample code.

If you still have lag after fixing that there are other options. Is it a constant stream of 40 messages per second? Perhaps implement a buffer that limits the number of state updates by filling the buffer on each event and processing all events in the buffer once every 500ms with only a single state update instead of updating state on each message.