Мне нужно сохранить большое количество предметов в состоянии.
Рассмотрим
this.setState(oldState => ({
items: [...oldState.items ...newItems]
}))
Создает новый массив и копирует все элементы здесь, что очень медленно.
Эффективным способом добавления элементов было бы добавление их в старый список, но для этого требуется состояние мутирования напрямую, что может привести или не привести к странным ошибкам.
В последнее время я перешел на использование состояния, как это:
this.setState({
["items"+num]: newItems
})
Например, if num==8, тогда мы создадим новый ключ в словаре "items8" и установим его значение равным массиву новых элементов.
Я предполагаю, что в этом случае React изменит состояние, чтобы добавить новую пару ключ-значение (в отличие от создания нового объекта состояния). Кроме того, я предполагаю, что React передаст ссылку в исходный массив, а не , дублируя массив.
Это эффективный способ использования состояния React с большой коллекцией предметов? Для целей этого вопроса давайте предположим, что я ничего не рендерил в DOM.
Редактировать: Меня попросили больше контекста в комментариях. Я работаю над реализацией бесконечной прокрутки с открытым исходным кодом. Это не для какой-то конкретной цели. Мои данные - это изображения, а мои метаданные содержат только URL-адреса для изображения и эскиза изображения. Однако кто-то, кто использует мою реализацию бесконечной прокрутки, может использовать ее для других целей, таких как посты в блогах, видео или любые другие типы элементов. Общая идея заключается в том, что, когда пользователь прокручивает страницу вниз, мы выбираем метаданные для большего количества элементов и хотим добавить эти метаданные в состояние. Поэтому, если кто-то прокручивает очень быстро, он может вызвать много изменений состояния в секунду, и я хочу, чтобы эти изменения состояния были быстрыми, даже если в состоянии много элементов.