Skip to main content

С какой целью использовать React Redux?

Redux является независимой библиотекой, которая может использоваться с любой UI логикой или с любым фреймворком, включая React, Angular, Vue, Ember и vanilla JS. Несмотря на частое использование Redux и React вместе, они независимы.

Использование Redux с любым фреймворком обычно включает библиотеку "UI привязки" для связи между Redux и этим фреймворком, нежели прямое взаимодействие с Redux хранилищем (store) из UI кода.

React Redux — это официальная библиотека привязки Redux к React. Если вы используете Redux и React вместе, мы рекомендуем рассмотреть React Redux для их связи.

Причины использовать React Redux исходят из понимания работы "библиотеки привязки UI".

Информация

Если вы задаётесь вопросом касательно использования Redux в общем, пожалуйста, прочитайте указанные ниже статьи. Их понимание необходимо для дискуссии о том, когда и почему вы можете захотеть использовать Redux и как конкретно его использовать:

Внедряем Redux в UI

Используя Redux с любой UI логикой требует выполнения последовательности шагов:

  1. Создать Redux хранилище (store)
  2. Подписаться на обновления
  3. Внутри колбэка подписки:
    1. Получить текущее состояние (state) хранилища (store)
    2. Извлечь используемые в этой части UI данные
    3. Обновить UI с извлечёнными данными
  4. Если необходимо, отрисовать UI со значениями по умолчанию
  5. Откликаться на ввод данные с UI путём отправки (dispatch) действий (action) в Redux хранилище (store)

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

Процесс подписки на хранилище (store), проверки на наличие обновленных данных и запуска перерисовки UI может быть более шаблонным и переиспользуемым. Библиотека привязки UI как React Redux обрабатывает логику взаимодействия с Redux хранилищем (store), поэтому при её использовании вам не придётся писать этот код самостоятельно.

Информация

Для глубокого погружения во внутреннее устройство библиотеки React Redux, обработку взаимодействия с хранилищем (store), прочитайте "Идиоматика Redux: История и Имплементация React Redux".

Причины использовать React Redux

Это официальная библиотека привязки Redux к React

Несмотря на то, что Redux может быть использован с любой UI логикой, изначально он был спроектирован для использования с React. Существуют библиотеки привязки UI для многих других фреймворков, но React Redux поддерживается напрямую командой Redux.

Будучи официальной библиотекой привязки Redux к React, React Redux следит за всеми изменениями обоих библиотек для гарантии того, что ваши React компоненты будут вести себя так, как ожидалось. Использование React Redux будет соответствует принципу дизайна React - написание декларативных компонентов.

Оптимизация производительность

React в целом быстрый, но по умолчанию любые изменения в компонентах будут вызывать перерисовку во всех дочерних компонентах. Если используемые компонентом данные не изменились, эта работа будет выполнена впустую, поскольку UI на выходе будет одним и тем же.

Если вас волнует быстродействие, то лучший путь для улучшения производительности — это пропустить ненужные перерисовки, т.е. перерисовывались компоненты исключительно при изменении данных, которые они используют. React Redux реализует множество оптимизаций производительности, таким образом ваши компоненты будут перезагружаться только при необходимости.

Кроме того, путем соединения нескольких компонентов вашего дерева компонентов React, вы можете убедиться, что каждый соединённый компонент извлекает конкретные фрагменты данных из состояния Redux хранилища (store). Это значит, что вашим компонентам будет необходимо перерисовываться реже, потому что большую часть времени конкретные фрагменты не будут меняться.

Поддержка сообщества

Будучи официальной библиотекой связки Redux к React, React Redux имеет большое сообщество пользователей. Это упрощает поиск помощи, изучение лучших практик, использование библиотек, сделанных поверх React Redux и переиспользовать знания в различных приложениях.

Ссылки и рекомендации

Понимание React Redux

Ссылки на сообщества