React Context против React Redux, когда мне следует использовать каждый из них?

Поскольку Контекст больше не является экспериментальной функцией, и вы можете использовать Context в своем приложении напрямую, он отлично подходит для передачи данных глубоко вложенным компонентам, для которых он был разработан.

Как написал Марк Эриксон в своем блог:

If you're only using Redux to avoid passing down props, context could replace Redux - but then you probably didn't need Redux in the first place.

Context also doesn't give you anything like the Redux DevTools, the ability to trace your state updates, middleware to add centralized application logic, and other powerful capabilities that Redux enables.

Redux намного мощнее и предоставляет большое количество функций, которые Context Api не предоставляет, также как упоминалось в @danAbramov.

React Redux uses context internally but it doesn’t expose this fact in the public API. So you should feel much safer using context via React Redux than directly because if it changes, the burden of updating the code will be on React Redux and not you.

Его задача Redux - фактически обновить свою реализацию, чтобы она соответствовала последнему контекстному API.

Последняя версия Context API может использоваться для приложений, в которых вы просто используете Redux для передачи данных между компонентами, однако приложение, которое использует централизованные данные и обрабатывает запросы API в создателях действий, использующих redux-thunk или redux-saga, по-прежнему будет нуждаться в redux. Помимо этого, у redux есть другие связанные библиотеки, такие как redux-persist, которые позволяют вам сохранять данные в localStorage и восстанавливать их при обновлении, что API контекста все еще не поддерживает.

Как упомянул @dan_abramov в своем блоге Возможно, вам не понадобится Redux, у этого redux есть полезное приложение, например

• Persist state to a local storage and then boot up from it, out of the box.
• Pre-fill state on the server, send it to the client in HTML, and boot up from it, out of the box.
• Serialize user actions and attach them, together with a state snapshot, to automated bug reports, so that the product developers
  can replay them to reproduce the errors.
• Pass action objects over the network to implement collaborative environments without dramatic changes to how the code is written.
• Maintain an undo history or implement optimistic mutations without dramatic changes to how the code is written.
• Travel between the state history in development, and re-evaluate the current state from the action history when the code changes, a la TDD.
• Provide full inspection and control capabilities to the development tooling so that product developers can build custom tools for their
  apps.
• Provide alternative UIs while reusing most of the business logic.

С таким большим количеством приложений слишком рано говорить о том, что Redux будет заменен новым Context API.

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

С другой стороны, если вы используете Redux для всего остального (наличие контейнера предсказуемого состояния, обработка логики вашего приложения за пределами ваших компонентов, централизация состояния вашего приложения, использование Redux DevИнструменты для отслеживания, когда, где, почему и как изменилось состояние вашего приложения, или использование плагинов, таких как Форма Redux , Redux Saga, Отменить Redux, Redux Persist, Redux Logger, и т.д…), то у вас нет абсолютно никаких причин отказываться от Redux. API Context не предоставляет ничего из этого.

И я лично считаю, что расширение Redux DevTools - удивительный, недооцененный инструмент отладки, который сам по себе оправдывает использование Redux.

Некоторые ссылки:

• Redux еще не мертв!
• Вам может не понадобиться Redux
• Заменяют ли React Hooks Redux?

Я предпочитаю использовать redux с redux-thunk для выполнения вызовов API (также с использованием Axios) и отправки ответа редукторам. Он чистый и понятный.

Контекстный API очень специфичен для части react-redux о том, как компоненты React подключаются к хранилищу. Для этого подойдет react-redux. Но если вы хотите, поскольку Context официально поддерживается, вы можете использовать Context API вместо response-redux.

Итак, вопрос должен заключаться в контекстном API против реакции-редукции, а не в контекстном API против редукции. Кроме того, вопрос несколько самоуверенный. Поскольку я знаком с react-redux и использую его во всех проектах, я буду продолжать его использовать. (У меня нет стимула меняться).

Но если вы изучаете redux только сегодня и нигде не использовали его, стоит попробовать Context API и заменить response-redux на свой собственный код Context API. Может, так намного чище.

Лично это вопрос знакомства. Нет четкой причины выбирать одно перед другим, потому что они эквивалентны. А внутри react-redux все равно использует Context.

Единственные причины использовать Redux для меня:

• Вам нужен объект глобального состояния (по разным причинам, например, возможность отладки, постоянство ...)
• Ваше приложение велико или будет большим и должно масштабироваться для многих разработчиков: в таком случае вам, вероятно, понадобится уровень косвенности (например, система событий): вы запускаете события (в прошлом), а затем людей, которых вы не знаете, в своем организация действительно может их выслушать

Вероятно, вам не нужен уровень косвенности для всего приложения, поэтому можно смешивать стили и использовать локальное состояние / контекст и Redux одновременно.

• If you need to use middleware for various purposes. For example logging actions, error reporting, dispatching other requests depending on the server’s response, etc.
• When data coming from multiple endpoints influence single component/view.
• When you want to have greater control over actions in your applications. Redux enables tracking actions and data change, it greatly simplifies debugging.
• If you don’t want server response to directly change the state of your application. Redux adds a layer, where you can decide how, when and if this data should be applied. The observer pattern. Instead of creating multiple publishers and subscribers across the whole app, you just connect components to Redux store.

От: Когда использовать Redux?