редукция / реагирование состояния отображения на реквизиты с большими объемами обновлений состояния очереди данных

Question

Использование сокетов для прослушивания сервера; хранилище Redux постоянно обновляется тысячами записей данных. Обновление магазина занимает всего пару секунд, и тысячи объектов отправляются через действия. Тем не менее, использование функции connect-redux для сопоставления состояния моему компоненту с mapStateToProps, похоже, ставит в очередь изменения состояния и обновляет состояние компонента со скоростью около 7-10 записей в секунду. Это означает, что компонент React отрисовывается очень долго. Есть какие-нибудь решения, чтобы ускорить это? Кроме того, точное количество данных всегда будет меняться, и фиксированного количества не существует.

Вот мой компонент:

class TestComponent extends Component {
  state = {};

  componentDidMount() {
    this.props.connectToSocket();
  }

  render() {
    const { classes, width, people, vehicles, incidents, locations } = this.props;

    return (
      <div>
         Hello
      </div>
    );
  }
}

TestComponent.propTypes = {
  classes: PropTypes.object.isRequired
};

const mapStateToProps = state => {
  console.log(state);
    return {
      people: state.live.people,
      vehicles: state.live.vehicles,
      incidents: state.live.incidents,
      locations: state.live.locations
    }
};

const mapDispatchToProps = {
  connectToSocket: connectToSocket
};

export default connect(mapStateToProps,mapDispatchToProps(TestComponent));

Действие, которое инициализирует сокет, выполняется в функции componentDidMount (). Затем я вижу, как состояние выводится на консоль, однако при каждом обновлении оно печатает около 7-10 новых записей в секунду. Поскольку более 5000 обновлений хранилища происходят за очень короткий промежуток времени, сопоставление хранилища с избыточностью с реквизитами компонента занимает намного больше времени, а его рендеринг занимает более 5 минут.

Есть идеи?

Answer 1

Как правило, ответы здесь включают некоторую форму дозирования:

• Вы можете пакетировать данные, поступающие из сокета, чтобы вместо отправки N действий с 1 значением в каждом, вы могли отправлять 5 действий с N / 5 значениями каждого или что-то в этом направлении.
• Для сокращения количества уведомлений о подписке Redux можно использовать одно из различных промежуточных программных продуктов промежуточного программного обеспечения или хранилищ.

Дополнительные сведения и ссылки см. В разделе Redux FAQ о сокращении количества событий обновления магазина .