Визуализация данных ImmutableJS из хранилища Redux в виде графика

Question

Я работаю над приложением React и Redux, которое использует ImmutableJS для хранения всего своего состояния. Приложение получает данные от датчика с частотой около 100 Гц. Мне нужно нарисовать график, который обновляется в режиме реального времени и отображает эти данные. Я использовал React-Vis для графа, проблема в том, что он принимает массив объектов, а не структуру данных ImmutableJS.

Я решил это, преобразовав структуру данных ImmutableJS в массив, например так:

const data = this.props.HEGPercentage.toIndexedSeq().toArray()

Это работает, но проблема, с которой я сталкиваюсь, заключается в огромном лаге, если я запускаю это с реальными данными, я думаю, потому что он должен постоянно создавать новый массив.

Как я могу создать высокопроизводительное решение для этого и все еще использовать ImmutableJS?

Answer 1

Преобразование между простыми объектами JS и объектами Immutable.js может быть очень дорогим. В частности, fromJS() а также toJS() операции являются самыми дорогими операциями в библиотеке Immutable.js, и их следует избегать, насколько это возможно (особенно в Redux mapState функции).

Похоже, вы уже хотя бы на правильном пути. Используйте запомненные селекторы, чтобы сократить дорогостоящие преобразования, попробуйте округлить эти числа, если это возможно, чтобы было меньше бессмысленных изменений, и сократить общее количество обновлений в целом.

В моем списке ссылок React/Redux есть большой раздел статей по повышению производительности для React, Redux и Immutable.js, которые могут оказаться полезными.

Также стоит отметить, что я лично советую не использовать Immutable.js по разным причинам.