DEV Community

Cover image for Context API & State Managers
Dalcio
Dalcio

Posted on

2 1

Context API & State Managers

Por alguma razão bibliotecas como Redux são construidas usando Context API. E quando alguém no mundo React passa a conhecer ferramentas como Context API, Redux, Zustand, Recoil e por aí, muita das vezes fica preso na duvida muito comum (pelo menos eu já passei por isso), que é Quando devo usar o Context API ao invés de um State Manager?. Pois bem aqui vai o que penso sobre isso.

Antes de responde-lo vamos a algumas definições.

O que é o Context API?

O Context API representa uma forma de partilhar variaveis ou estados globais com componentes internos do mesmo (evitando situações como Prop drilling).

O que são State Managers?

São ferramentas que nos ajudam a gerenciar os estados mais complexos de uma aplicação. Controlando a forma que os dados podem ser modificadas, quando devem ser modificadas, porque, e por a´´i vai.

De acordo com o Open Replay, no ecossistema React os State Managers mais populares são: Redux, Recoil, Zustand, Jotai, Rematch e o Hookstate.

E então?

OK, agora que sabes o que é Context API e o que são State Managers, deixe-me dize-lo que tudo que consegues fazer com os State Managers consegues faze-lo com o Context API, mais o ponto é: Vale a pena? ou Devo perder tempo com isso?.

E eu digo-te que não, não vale a pena, afinal porque reinventar a roda?

O que acontece é que os State Managers já fornecem consigo um ferramental bem elaborado para podermos gerenciar os nossos estados de forma mais eficiente possível e o que acontece é que se tivéssemos que usar o Context API no lugar de libs como Redux, teriamos que nos preocupar em tratar os estados de forma a evitar renderizações desnecessárias afetando a perfomace da nossa aplicação.

Quando usar o Context API?

  • Temas — Passe para baixo o tema do aplicativo
  • i18n — Transmitir mensagens de tradução
  • Autenticação — Passar o usuário autenticado atual
  • Atomic Component Globalization: Quando temos um componente com alguns estados que precisam ser usados por componentes mais internos.

Image description

References

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (0)