корзина в redux. На каждом товаре должен быть счетчик количества товара в корзине. Есть ли какая то возможность оптимизации этого дела, чтобы при добавлении в корзину или изменении количества товара не перерисовывались(сравнивались) все 200 товаров, а обновлять как то точечно?
В голове есть идея сделать на каждый товар ссылку и через useImperativeHandle изменять state внутри товара с количеством. В голове хорошо работает… Но надо будет посмотреть расходы памяти на это дело
Как именно карточки рендерятся, каждая по id свои данные из редакса берёт, или свойства снаружи пробрасываются?
Снаружи. useSelector вызывается в компоненте списка товаров
Вот и причина, если в двух словах - в redux данные иммутабельны, поэтому каждый раз список перерисовывается. Либо функцию сравнения к memo свою писать, либо карточки отдельно к redux прибивать, а не весь список. В доке или в статьях Абрамова, не помню уж точно, есть про это - слайс данных должен быть как можно тоньше, чтобы рендерилось только то что требуется.
Причину то я знаю) Я решение не знаю. А вот про функцию сравнения memo интересно. Сейчас погуглю. Похоже на то, что мне нужно.
Я про второй аргумент у memo и не знал. Теперь вижу export default React.memo(MyComponent, areEqual);. Спасибо вам за подсказку. Попробую реализовать. Этот вариант лучше чем то, что я хотел попробовать
Обсуждают сегодня