Введение

Redux — это контейнер с предсказуемым состоянием для приложения javascript. Мы можем использовать redux со многими библиотеками и фреймворками java-скриптов, такими как angular, react и т. д. Redux — это просто реализация шаблона Flux с некоторыми вариациями. Эти вариации на самом деле облегчают обучение.

По мере роста приложения становится сложно поддерживать его организованность и поддерживать поток данных. Redux решает эту проблему, управляя состоянием приложения с помощью одного глобального объекта Store. Фундаментальные принципы Redux помогают поддерживать согласованность во всем приложении, что упрощает отладку и тестирование.

Что такое Редукс??

Redux — это библиотека JavaScript с открытым исходным кодом для управления состоянием приложения. Чаще всего он используется с такими библиотеками, как React или Angular, для создания пользовательских интерфейсов. Подобная (и вдохновленная) архитектурой Flux Facebook, она была создана Дэном Абрамовым и Эндрю Кларком.

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

Redux — это контейнер с предсказуемым состоянием для приложений JavaScript. Другими словами, это архитектура потока данных приложения, а не традиционная библиотека или фреймворк вроде Underscore.js и AngularJS.

Redux используется в основном для управления состоянием приложения. Подводя итог, Redux поддерживает состояние всего приложения в одном неизменном дереве состояний (объекте), которое нельзя изменить напрямую. Когда что-то меняется, создается новый объект (используя действия и редукторы).

Базовые принципы

Единственный источник правды

Состояние всего вашего приложения хранится в дереве объектов в одном хранилище. Поскольку все состояние приложения хранится в одном дереве, это упрощает отладку и ускоряет разработку.

Состояние только для чтения

Единственный способ изменить состояние — запустить действие, объект, описывающий, что произошло. Это означает, что никто не может напрямую изменить состояние вашего приложения.

Изменения вносятся с помощью чистых функций

Чтобы указать, как дерево состояний преобразуется действиями, вы пишете чистые редукторы. Редуктор — это центральное место, где происходит изменение состояния. Редьюсер — это функция, которая принимает состояние и действие в качестве аргументов и возвращает обновленное состояние.

Редукционная структура

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

Redux был вдохновлен Flux. Redux изучил архитектуру Flux и убрал лишнюю сложность.

В Redux нет концепции Dispatcher.

У Redux есть только один магазин, тогда как у Flux много магазинов.

Объекты Action будут получены и обработаны непосредственно Store.

Редукс — поток данных

Redux следует однонаправленному потоку данных. Это означает, что данные вашего приложения будут следовать в одностороннем потоке данных привязки. Redux снижает сложность кода, применяя ограничение на то, как и когда может происходить обновление состояния. Таким образом, легко управлять обновленными состояниями. Мы уже знаем об ограничениях как о трех принципах Redux.

  • Действие отправляется, когда пользователь взаимодействует с приложением.
  • Функция корневого редуктора вызывается с текущим состоянием и отправленным действием. Корневой редуктор может разделить задачу между более мелкими редукторными функциями, что в конечном итоге вернет новое состояние.
  • Хранилище уведомляет представление, выполняя свои функции обратного вызова.
  • Представление может получить обновленное состояние и снова выполнить повторную визуализацию.

Вывод

Redux набирает обороты с каждым днем. Многие компании (Uber, Khan Academy, Twitter) успешно использовали его в производстве. Некоторые разработчики могут жаловаться на большие накладные расходы. Несмотря на то, что Redux может быть не идеальным решением для вашего приложения или фреймворка, настоятельно рекомендуется использовать Redux, особенно для приложений React.