React Context vs React Redux, quando devo usar cada um? [fechadas]

React 16.3.0 foi lançado e a API Context não é mais um recurso experimental. Dan Abramov (o criador do Redux) escreveu um bom comentário aqui sobre isso, mas já se passaram 2 anos quando o Contexto ainda era um recurso Experimental.

Minha pergunta é, em sua opinião / experiência quando devo usar o React Context em vez do React Redux e vice-versa?

Como o Contexto não é mais um recurso experimental e você pode usar o Contexto em seu aplicativo diretamente, isso será ótimo para transmitir dados a componentes profundamente aninhados para os quais foi projetado.

Como Mark Erikson escreveu em seu blog :

Se você está usando o Redux apenas para evitar a passagem de objetos, o contexto poderia substituir o Redux - mas provavelmente você não precisava do Redux em primeiro lugar.

O contexto também não oferece nada como a Redux DevToolscapacidade de rastrear suas atualizações de estado, middlewareadicionar lógica de aplicativo centralizado e outros recursos poderosos que Reduxpermitem.

Reduxé muito mais poderoso e oferece um grande número de recursos que o Context Apinão oferece, também como o @danAbramov mencionou

O React Redux usa contexto internamente, mas não expõe esse fato na API pública. Portanto, você deve se sentir muito mais seguro usando o contexto através do React Redux do que diretamente, porque se ele mudar, a carga de atualizar o código será do React Redux e não de você.

É até Redux para realmente atualizar sua implementação para aderir à API de contexto mais recente

A última API de contexto pode ser usada para aplicativos em que você simplesmente usaria Redux para passar dados entre componentes, no entanto, aplicativos que usam dados centralizados e tratam de solicitações de API em criadores de ação usando redux-thunkou redux-sagaainda precisariam de redux. Além disso, o redux tem outras bibliotecas associadas, como redux-persistque permitem que você salve dados armazenados em localStorage e reidrate na atualização, que é o que a API de contexto ainda não suporta.

Como @dan_abramov mencionou em seu blog Você pode não precisar do Redux , que tem aplicativos úteis como

• Persista o estado em um armazenamento local e inicialize a partir dele, pronto para uso.
• Pré-preencher o estado no servidor, enviá-lo ao cliente em HTML e inicializar a partir dele, pronto para uso.
• Serialize as ações do usuário e anexe-as, junto com um instantâneo do estado, a relatórios de bugs automatizados, para que os desenvolvedores do produto
  possam reproduzi-los para reproduzir os erros.
• Passe objetos de ação pela rede para implementar ambientes colaborativos sem mudanças dramáticas em como o código é escrito.
• Mantenha um histórico de desfazer ou implemente mutações otimistas sem mudanças dramáticas em como o código é escrito.
• Viaje entre o histórico do estado em desenvolvimento e reavalie o estado atual a partir do histórico da ação quando o código mudar, a la TDD.
• Fornece recursos completos de inspeção e controle para as ferramentas de desenvolvimento para que os desenvolvedores de produtos possam construir ferramentas personalizadas para seus
  aplicativos.
• Fornece UIs alternativas enquanto reutiliza a maior parte da lógica de negócios.

Com essas muitas aplicações, é muito cedo para dizer que Redux será substituído pela nova API de contexto

Se você estiver usando Redux apenas para evitar passar props para componentes profundamente aninhados , então você pode substituir Redux pela ContextAPI. Ele se destina exatamente a este caso de uso.

Por outro lado, se você estiver usando Redux para todo o resto (ter um contêiner de estado previsível, manipular a lógica de seu aplicativo fora de seus componentes, centralizar o estado de seu aplicativo, usar Redux DevTools para rastrear quando, onde, por que e como o estado de seu aplicativo alterado, ou usando plug-ins como Redux Form , Redux Saga , Redux Undo , Redux Persist , Redux Logger , etc ...), então não há absolutamente nenhuma razão para você abandonar o Redux. A ContextAPI não fornece nada disso.

E eu pessoalmente acredito que a extensão Redux DevTools é uma ferramenta de depuração incrível e subestimada, o que por si só justifica continuar usando o Redux.

Algumas referências:

• Redux ainda não está morto!
• Você pode não precisar de redux
• Os Ganchos React Substituem Redux?

Eu prefiro usar redux com redux-thunk para fazer chamadas de API (também usando Axios) e despachar a resposta para redutores. É limpo e fácil de entender.

A API de contexto é muito específica para a parte react-redux de como os componentes React são conectados à loja. Para isso, o react-redux é bom. Mas se você quiser, uma vez que Context é oficialmente suportado, você pode usar a API Context em vez de react-redux.

Portanto, a questão deve ser Context API vs react-redux, e não Context API vs redux. Além disso, a questão é ligeiramente opinativa. Já que estou familiarizado com o react-redux e o uso em todos os projetos, continuarei a usá-lo. (Não há incentivo para eu mudar).

Mas se você está aprendendo redux apenas hoje e não o usou em nenhum lugar, vale a pena dar uma chance à Context API e substituir react-redux por seu código customizado da Context API. Talvez seja muito mais limpo dessa forma.

Pessoalmente, é uma questão de familiaridade. Não há nenhuma razão clara para escolher um em vez do outro porque eles são equivalentes. E internamente, react-redux usa Context de qualquer maneira.

As únicas razões para usar Redux para mim são:

• Você quer um objeto de estado global (por vários motivos, como depuração, persistência ...)
• Seu aplicativo é ou será grande e deve escalar para muitos desenvolvedores: nesse caso, você provavelmente precisa de um nível de indireção (ou seja, um sistema de eventos): você dispara eventos (no passado) e, em seguida, pessoas que não conhece em seu organização pode realmente ouvi-los

Você provavelmente não precisa do nível de indireção para todo o seu aplicativo, então é bom misturar estilos e usar estado / contexto local e Redux ao mesmo tempo.

• Se você precisar usar middleware para vários fins. Por exemplo, ações de registro, relatório de erros, envio de outras solicitações dependendo da resposta do servidor, etc.
• Quando os dados provenientes de vários terminais influenciam um único componente / visualização.
• Quando você deseja ter maior controle sobre as ações em seus aplicativos. Redux permite rastrear ações e alterações de dados, simplificando muito a depuração.
• Se você não quiser que a resposta do servidor altere diretamente o estado do seu aplicativo. Redux adiciona uma camada, onde você pode decidir como, quando e se esses dados devem ser aplicados. O padrão do observador. Em vez de criar vários editores e assinantes em todo o aplicativo, você apenas conecta os componentes à loja Redux.

De: Quando usar Redux?