Comments 18
MobX мутирует состояние
Для профайлинга рекомендую React Perf (недавно переписан) + расширение для Chrome.
Вообще-то, для такой цели давно изобретен Reselect.
И под шум волны можно использовать Virtualized, для рендеринга большого количества элементов в списке/гриде.
И под шум волны можно использовать Virtualized, для рендеринга большого количества элементов в списке/гриде.
Статья про то, что есть shouldComponentUpdate.
В коде редьюсера есть прекрасное:
По сути, вам нужно вернуть копию массива с замененным одним элементом. Это делается через map в одну строку
К чему это увлечение модным синтаксисом, если можно проще?
А поскольку статья о производительности, то замечу, что это будет еще и быстрее.
state = {
targets: [
...state.targets.slice(0, i),
updatedTarget,
...state.targets.slice(i + 1)
]
}
По сути, вам нужно вернуть копию массива с замененным одним элементом. Это делается через map в одну строку
state.targets.map((target, index) => index === i ? updatedTarget : target)
К чему это увлечение модным синтаксисом, если можно проще?
А поскольку статья о производительности, то замечу, что это будет еще и быстрее.
Согласен, map выглядет намного проще. Про производительность у меня есть сомнения (да-да, я прочитал дискуссию по ссылке), но всё же следует проверить самому. В любом случае, я не думаю что разница большая.
UFO just landed and posted this here
А если вместо нативного map взять lodash map то еще быстрее будет =)
Javascript-ninja же!
shouldComponentUpdate(newProps, newState) {
// проверяем что порядок и кол-во элементов остались прежними
// то есть если id остались прежними, значит у нас нет "больших" изменений
const changed = newState.targets.find((target, i) => {
return this.state.targets[i].id !== target.id;
});
return changed;
}
здесь может вылететь ошибка, если в newState.targets
больше элементов, чем в this.state.targets
Статью можно сократить до предложения «Используйте mobx для менеджмента стейта приложения.». Полностью согласен, кстати.
Sign up to leave a comment.
Оптимизируем React приложение для отображения списка элементов