Рендер только новых элементов при добавлении их в массив?

При реализации инфинити скролла, с сервера подгружаются новые товары, и вопрос в том, как отменить ререндер тех компонентов, которые уже были в массиве, и рендерить только новые добавленные элементы
Дело в том что если из массива отрисовываются простые компоненты, то это не трудно и быстро, но если рисуются карточки товара которых уже 300 штук и при добавлении новых 20 в массив перерисовываются ещё и старые 300.
Песочница для примера https://codesandbox.io/s/sad-khayyam-lskxj?file=/s...
  • Вопрос задан
  • 120 просмотров
Решения вопроса 1
Krasnodar_etc
@Krasnodar_etc
little front
Вы же слышали про shouldComponentUpdate ?) Просто добавьте его к вашим item-компонентам
Или React.memo для функциональных компонентов

Но вообще, если у вас компоненты в цикле выводятся, а не просто div-блоки, то при тех же пропсах ререндера не будет. Просто это не в map нужно в консоли проверять, а внутри самого компонента-item. map в любом случае обязан перебрать все элементы
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
0xD34F
@0xD34F
key={elem * Math.random()}

при добавлении новых 20 в массив перерисовываются ещё и старые 300

нет слов
5ce68e39b7718977335131.jpeg
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы