Context API vs Zustand - Guia de State Management no ReactJS

[@devjunioralves]

Quer se tornar um dev melhor? Leia esses livros: Código Limpo amzn.to/3hHXVKY Como ser um programador melhor amzn.to/3POQ5fq Arquitetura Limpa amzn.to/3Viqw7v Estruturas de dados e algoritmos com JavaScript amzn.to/3hM0L1u Entendendo Algoritmos: Um guia ilustrado para programadores e outros curiosos amzn.to/3BWsaEO 14 hábitos de desenvolvedores altamente produtivos amzn.to/3uZqsyy Hábitos Atômicos amzn.to/3FGllIM Aprendendo a Aprender amzn.to/3WxM0hG Rápido e devagar amzn.to/3PLrYhq A vida dos Estoicos amzn.to/3vaQIGl Meditações de Marco Aurélio amzn.to/3joFYS1

[@henriquebarros8303]

Dev Júnior, lembra do meu comentário em um outro vídeo seu? Então, o problema da renderização no App como um todo se deu muito provavelmente pelo mesmo motivo: Por ter colocado todos seus provedores centralizados. Isso nem de longe é uma boa prática! Se você separar corretamente acredito que você verá que ambos terão praticamente o mesmo comportamento. Refletindo um pouco mais além, pode ser que se você precisar que aquele seu STATE criado com Zustand tenha seu valor inicial definido de forma dinâmica, talvez você tenha que utilizar contexto da mesma forma, visto que o dado precisa vir de algum outro lugar (Um leve chute, já que não utilizei muito a ferramenta) "Ahhhh, Henrique. Mas se não for assim vou ter problema de performance porque vai ter renderização extra." Bem-vindo ao mundo React, onde o desenvolvedor tem que se preocupar com coisas desnecessárias desse tipo! Existem outras soluções além do React, como o Vue que é uma delicinha, o Angular com as novas atualizações, o Svelt Kit. Se é o que sua empresa definiu, existem abordagens menos drásticas como os signals. Mas ainda assim, meu conselho seria para ter cuidado ao utilizar ferramentas de terceiros dessa forma porque você acaba virando refém dela, certas vezes você aumenta a complexidade do teu projeto de forma nem tão benéfica assim. Sem falar que elas são substituídas periodicamente. É só olhar para ferramentas de estilização: Era um hyper tremendo no Styled Components, agora é o Tailwind! Essas coisas ficam obsoletas facilmente. Na maioria dos casos, o produto nem precisa ser um SPA. Por fim, vou deixar uma dúvida minha: Como funciona o garbage collector do Zustand?

[@pthiago_s5075]

Pra editar a mesma palavra no arquivo inteiro: seleciona a palavra e ctrl shift L Extensão pra manter o case das palavras: multiple cursor case preserve Pra editar uma variável ou função e ela refletir em todos os arquivos onde ela é usada: seleciona a palavra e F2

[@johnc0de]

Salve Junior, parabéns pelo trabalho! Eu tenho acompanhado seus videos recentemente e tenho curtido bastante! Curto seus videos longos por darem um proximidade boa com a realidade! Gostaria de compartilhar 2 problemas pessoais que me atrapalham de ver mais conteúdos seus ( e talvez isso te ajude de alguma forma): - Eu tenho TDAH e isso faz com que eu perca a linha de raciocínio mt rapido, então talvez um mais acertivos nos pontos que quer mostrar me ajudaria bastante - Atualmente na minha rotina eu tenho muito pouco tempo então um video um pouco mais curto e mais estruturado ajudaria bastante a consumir suas dicas e conteúdo! Sei que é um pouco diferente da proposta do canal mas creio que consiga atingir os 2 públicos futuramente!

[@devjunioralves]

Sensacional seu feedback! Agradeço muito. Exatamente como você comentou, costumo fazer vídeos maiores pra de fato trazer ar um de realidade mesmo. Mas seu ponto é extremamente importante! Já tenho vários vídeos prontos, mas com certeza os vou gravar a partir de agora, vou levar em consideração seu feedback. A proposta do canal é trazer conteúdo sobre programação para todo mundo que queira aprender, então todos que se encaixam nesse nicho, são muito bem vindos!

[@viperluan]

Excelente conteúdo mano! Tenho acompanhado várias aulas porque tá muito bom mesmo.

[@caiopereira9607]

Excelente vídeo Junior, sempre ouvi falar sobre o Zustand mas nunca tinha visto como funcionava na prática. Achei muito bacana e útil. Tem outra lib que ouço falar bastante também, se chama Jotai, você já pensou em trazer algum conteúdo sobre ela? Gostaria muito de ver um vídeo sobre com a sua didática.

[@devjunioralves]

Valeu demais Caio!!! Sim, conheço a Jotai, não usei tanto como a Zustand, mas posso trazer um vídeo sim.

[@StephaniePharias-sv6he]

Preciso consumir mais conteúdos seus, em um vídeo eu já aprendi MTA coisa, vários detalhes que eu não uso e faz total sentido usar, sem falar no foco principal do vídeo

[@adrielsantana8929]

Estava esperando o vídeo, sensacional!

[@devjunioralves]

Que massa! Que bom que tu curtiu 👊

[@VagnerMaltauro]

muito bom seu conteúdo mano! Bem explicativo.

[@devjunioralves]

Valeu demais mano!!!

[@bruno-dev]

pow nunca tinha mexido com ela... parece ser mto top

[@devjunioralves]

Show de bola!

[@fabio1480]

Ja me perguntei algumas vezes se os states dos contextos forcavam seus filhos a regenerar. Sempre acreditei que a context api ja previa isso. Me convenceu de mais. irei aderir ao zustand tbm.

[@ribeiro.evandro]

Eu já conheço essa lib, mas não usei muito... Uma coisa que faltou, é sobre com trabalhar com persistência com a Zustand...

[@MatheusHenrique-sk2od]

ele tem um cara chamado persist (algo assim o nome) que você usa junto com o create ali

[@devjunioralves]

Exatamente como o Matheus disse, basta utilizar o persist. Nesse vídeo o objetivo era comparar o Zustand com a Context API, o Zustand tem mais funcionalidades interessantes. Posso trazer mais conteúdo sobre o Zustand aqui pro canal se vocês quiserem.

[@gabriel15559]

Muito bom o video, mas pelo oq eu percebi n serie ideal usar o Zustand sempre em vez da context? Se não qual seria os casos que a context "levaria a melhor"

[@half7752]

Jr, faz um vídeo falando de todas as libs que você usa nos seus projetos, e de que forma você usa elas

[@devjunioralves]

Boa Rafa, excelente ideia!

[@iuritorres]

cara, como você faz pra deixar o escopo ativo com destaque? Ex.: em 5:15 vc ta dentro do return entao ele ta sublinhando de rosa o return e a parte esquerda dele, pensei que fosse o tema, instalei o Illusion mas nao mudou aq

[@prosaka]

Bom video! Parabens !!

[@devjunioralves]

Valeu demais!!!

[@weslenfm]

Uma dica de vídeo se é que vc tem e eu não vi rs, Quando usar useReduce, um gerenciador de estados no caso o Zustand ou apenas o useState ?

[@juninfortunato]

Incrível, Qual o nome da extensão para mudar os ícones das pastas ???

[@devjunioralves]

Chama Symbols Icon, tem um vídeo aqui no canal onde mostro meus temas, configs e extensões no meu vscode, confere lá, tu vai curtir!

[@RB-jm7zd]

Brabo demais!

[@emanoelinfinity]

Mano não conhecia a zustand, depois desse vídeo vou dar uma atenção.

[@devjunioralves]

Mano, recomendo bastante, acho ele bem simples e poderoso.

[@lincolnruteski7158]

Mto bom, estou seguindo assistindo seus videos e estou gostando muito, estao me ajudando bastante. Vc poderia disponibilizar esse codigo pra estudo? que nele tem a comparação entre a context e o zustand, outra coisa, eu nao consegui enxergar na zustand como fazer chamada para API, no caso vc esta trabalhando com array, no context fica bem claro onde e como fazer isso.

[@devjunioralves]

Valeu demais Lincoln! Sim, vou disponibilizar, estou criando um repositório para colocar os códigos mostrados nos vídeos. Sobre sua dúvida, tu consegue passar qualquer função dentro de um state do Zustand, deixando assim global. Mas cuidado, pense bem se isso faz sentido e de fato é necessário.

[@ivoneijr]

muito bom mano!

[@devjunioralves]

Valeuuu mano!

[@jeffersoncarvalho2566]

O estado dos stores fica salvo de maneira global, igual no contexto? Por exemplo, se dentro do Card Products eu tiver a listagem de Users, quando atualizar e estado no Card de User, vai atualizar a listagem de Users em Products?

[@devjunioralves]

Pra efeito de entendimento, sim, é parecido com a Context API. E sim, se o state for o mesmo, se atualizar em um ponto da aplicação, ele será atualizado em todos os lugares onde estiver sendo utilizado.

[@jeffersoncarvalho2566]

@@devjunioralves Não , mas eu tô falando 2 states diferentes, dois stores

[@devjunioralves]

@@jeffersoncarvalho2566 Não, se forem diferentes, nao atualiza. Ele só atualiza o store que sofreu alteração.

[@jeffersoncarvalho2566]

@@devjunioralves Então não faz sentido comparar com a context api, porque ela serve pra compartilhar estados num contexto. Por exemplo, dentro do meu componente de Users, eu saber do estado atual de Products também

[@devjunioralves]

@@jeffersoncarvalho2566 A Context API não é um gerenciador de estados, como eu digo no vídeo. Eu comparei pois a galera tem bastante duvida em relação a isso, mas no vídeo mesmo comento que são ferramentas com propósitos diferentes.

[@FogusReis]

Booa, tudo beem?? tem uma coisa que não entendi, como ele obtem a informação para aplicação toda, imaginamos que eu faça uma função de signIn do cliente, na hora que ele fizer a função ja busca na api os dados do cliente na "/me" com get, e guardar no estado, até ok, mas como a aplicação toda vai ter acesso a esses dados vindos da api, sendo que não esta por volta da aplicação?

[@gabrieldeoliveiraalmeida]

Para salvar um Oobjet no Zustand, com o typescript devo usar Record ou Map?

[@devjunioralves]

Eu recomendo com Record.

[@maxwellalvesdesousa5153]

opa, parabéns pelo vídeo!, Contudo, queria fazer uma ressalva. O context não precisa tá na Raiz (APP). Na vdd, vc tbm poderia só te passado o context provider na pagina q vc quer, se vc passa no APP, logo, atualiza tudo, se vc tivesse passado na Home, acredito que esse problema só se refletiria na Home. Mesmo assim, o Zustand se torna mais vantajoso, por que ele encapsulo, logo, como os dois componentes que contém seu store (context) estão na mesma pagina, um não interfere no outro. PS: Foi só uma observação mesmo. Mas eu entendi sim o motivo do video.

[@devjunioralves]

Perfeito Maxwell! Concordo com você. De fato conseguimos passar um Provider para um conjunto específico, mas na maioria dos casos, passamos por volta da app inteira. E como você disse, mesmo assim, o Zustand ainda tem vantagem, até por que a Context API não é um state management já o Zustand é. Valeu pelo feedback!

[@higorkkkkk4661]

Isso eu só vi na gringa em, obg!

[@devjunioralves]

Boa Higor! Quero trazer mais conteúdo avançado em português!

[@half7752]

uma duvida que me apareceu agora junior, em que casos seria necessário um state managment? por exemplo, no exemplo que você deu no video acho que um state lift up ja resolveria, quando eu precisar compartilhar estados entre componentes, qual seria uma boa hora pra encaixar o zustand e nao usar um lift up? o zustand ele deve ser usado somente como estado global ou tambem posso usar o zustand pra determinado "contexto"? por exemplo criar um templates/SpecifcPage/store, assim evitando o prop drilling entre os componentes criados nessa pagina, algo assim é errado? nesses casos seria melhor um lift up ou ate mesmo uma context api?

[@half7752]

to com uma task pra resolver e consigo resolver o problema dessas duas formas, mas queria saber qual das duas seria ideal

[@devjunioralves]

É dificil responder assim Rafa, mas vou tentar pra te ajudar. Uma aplicação exigirá, geralmente, um state management, quando ela for de médio a grande porte, com vários componentes/telas que necessitam de compartilhar states complexos (por exemplo, dados vindos de uma api). A forma que tu disse, não ta errada, pois se os componentes que precisam dessas informações estao no mesmo nível e são filhos do mesmo componente pai. Se conseguir assim, não vejo a necessidade de um state management.

[@matheusfrazao6465]

Muito bom vídeo, como sempre! Muito obrigado pelo conhecimento passado e meus parabéns pelo trabalho! Em relação ao Zustand encontrou problemas para integrá-lo com SSR, do Next por exemplo? Me lembro de passar por algumas dificuldades quando precisava de informações da store da aplicação para retornar alguma tela usando SSR, porém com o Redux isso é possível de se resolver através de Hydrate, e no caso do Zustand consigo esse compartilhamento de informações ainda do lado do SSR via Hydrate ou algo do tipo?

[@devjunioralves]

Valeu demais Matheus! E sim, conseguimos sim fazer algo parecido com o Zustand no Next.js. Inclusive (spoiler) é o assunto do vídeo que to preparando, por que no Next.js 13, com os server components, muda vários detalhes.

[@adrielsantana8929]

@@devjunioralves esperando um vídeo detalhado sobre os async components e como utilizar melhor deles, tomara que sane minhas dúvidas

[@devjunioralves]

@@adrielsantana8929 Tu fala sobre os server components do Next.js 13? Quando tu transforma o componente em async, tu pode, por exemplo, realizar requisições à APIs dentro do próprio componente.

[@gustadev276]

Muito bom o vídeo!!! Me surgiu uma duvida, em quais casos vc usaria a context ou zustand ?. Tem algum cenário que a context se faz superior ?

[@devjunioralves]

Superior não, por que suas ferramentas para problemas diferentes. Existem situações que não seria necessário um state management, aí a Context API já resolveria, tipo resolver problema de prop drilling (tem vídeo aqui no canal falando sobre isso). Um toggle theme, a Context seria uma boa também.

[@igorsteixeira94]

Quem nunca teve problemas de performance usando ContextApi que atire a primeira pedra haha! Não conhecia essa lib, funciona em react-native tbm?

[@devjunioralves]

Com certeza haha Sim mano, funciona 100% Um combo interessante é a Zustand + React Query no react-native!

[@MatheusPereira-nn9dj]

Esse comando que é relacionado ao crtl + shift + l que voce seleciona cada palavra que voce quer agrupar é muito legal , tem isso no windows ?

[@devjunioralves]

Acho que tem sim Matheus!

[@romaosanches]

Boa tarde Junior, tudo bem? Eu gostaria de tirar uma duvida, com a comparação que você fez da Context API x Zuztand, você explica que o Context API eu tenho que colocar em volta da aplicação toda, com isso eu consigo utilizar a funcionalidade de Context API em qualquer lugar, quando você mostrou com o Zuztand, você não precisou colocar por volta da aplicação inteira, mas com o Zuztand, eu tenho a mesma funcionalidade de ter para o app todo o compartilhamento do estado e das funcionalidades?, o Zuztand compartilha o estado com todos os componentes? Obrigado desde já, e o seu video é muito bom, conteúdo muito bom. Abraço

[@devjunioralves]

Fala Rodrigo, boa noite, tudo bem cara e com você? Exatamente, com o Zustand, tu compartilha os dados para toda a aplicação, só u chamar o hook e informar quando dado quer, como mostro no vídeo. Ele de fato é um gerenciador de estados, isso de forma global na aplicação.

[@gabrielfpp47]

Salve Junior, o que você acha do redux tk? Usei ele em um projeto e é super simples

[@devjunioralves]

Opa, salve Gabriel, tudo tranquilo man? Eu usei bem pouco o RTK, faz um tempo que não utilizo Redux no dia a dia. Mas de fato o RTK é simples, acho que ele tem sim suas utilidades, porém, eu mesmo, ultimamente, venho utilizando o Zustand.

[@rodrigoelias1987]

Não conhecia essa lib, vou dar uma olhada nela depois. Junior, o que você acha do redux?

[@devjunioralves]

Boa, recomendo muito estudar ela. Sobre o Redux, na minha opinião, ele foi essencial quando foi criado, porém, hoje em dia, existem soluções mais simples que resolvem mais 90% das situações, não tendo necessidade de utilizar o Redux. Exemplo seria utilizar o Zustand + React Query. Salvo pouquíssimos casos que o Redux de fato é necessário.

[@christoferluiz365]

@@devjunioralves Consegue me dar algum exemplo, seja de algum caso ou de alguma aplicação, onde o Redux seria necessário? Muito bom o vídeo, alias!

[@devjunioralves]

@@christoferluiz365 Em um projeto de larga escala, onde precise controlar vários estados globais complexos (exemplo: retornos de API). Ou, o mais comum de acontecer, projetos que já estão rodando e utilizam o Redux, pois na época, o único state management completo era ele. Espero ter conseguido responder sua dúvida. Muito obrigado Christofer!!!

[@lincolnruteski7158]

vendo o video uma segunda vez, estou pensando, com o redux acontece a msm coisa que acontece com o context? pergunto pq a base do redux é o context.

[@devjunioralves]

Não, o Redux possui "camadas" encima da Context API que possui um melhor controle.

[@lincolnruteski7158]

@@devjunioralves entendo, e o zustend, substituiria sem problema algum todas as funcionalidades do redux em uma aplicação ?

[@devjunioralves]

@@lincolnruteski7158 Depende muito do projeto, mas creio que na esmagadora maioria dos casos, o Zustand é o suficiente.

[@lincolnruteski7158]

@@devjunioralves fiz os testes com o redux aqui, ele faz a msm coisa que o context, quando atualiza uma coisa, ele atualiza toda a arvore abaixo dele,

[@devjunioralves]

@@lincolnruteski7158 Tu utilizando os selectors, isso acontece?

[@nandoomb]

Mas este problema de encadeamento de renderização só vai acontecer se você colocar o contexto acima de tudo… O ideal no caso é que você feche o seu contexto, mantendo apenas o componente de Users ou Products dentro dele. Em outras palavras, um context para cada “escopo”. Isso não te impede de ter também um context principal. Concordo que zustand é melhor, sou um grande fã da lib e já uso a bastante tempo, mas penso que valia a pena mostrar como corrigir o problema usando o próprio context api. Logicamente a esmagadora maioria ainda iria preferir o zustand, mas o que ficou parecendo é que a context api tem algum nível de “bug”. De todo modo, parabéns pelo trabalho, venho acompanhando a bastante tempo já. Grande abraço

[@devjunioralves]

Concordo com você, o que quis mostrar no vídeo é que a Context API e o Zustand são ferramentas para propósitos diferentes, a Context API não é um gerenciador de estados, já o Zustand sim. A grande maioria utiliza a Context API para resolver problemas onde ela não é a ferramenta ideal. Perfeito seu ponto. Grande abraço!

[@nandoomb]

@@devjunioralves Nesse ponto, perfeito! Valeu mano, TMJ 💪🏽

[@devjunioralves]

@@nandoomb Tmj 👊

[@natanrce]

Qual o tema do vscode?

[@devjunioralves]

Chama Illusion, tenho um vídeo onde mostro minhas configs, temas e extensões que uso no vscode, da uma olhada lá, tu vai curtir!

[@Voit26]

Video top mano parabéns, outro problema que eu costumo ter com a contextAPI é que um contexto encapsulado dentro de outro não consegue usar o contexto do pai(o que não é um problema da API claro) e isso quebrou minhas pernas em vários projetos... O zustand me ganhou só por não precisar de um provider e nem ser tão complexo/verboso como redux! Uma dúvida, tu aprendeu a separar states e actions dentro da store com quem/onde? eu peguei esse habito a um tempo mas não consigo lembrar a origem kkkkkkk

[@devjunioralves]

Com certeza mano, concordo contigo. O Zustand é poderoso e simples de utilizar. Eu não lembro, mas faz tempo que separa assim kkkk Valeu demais mano!

[@frank511]

Seria massa um vídeo com setup de Sass, ainda tem muitas vagas que pedem ele

[@devjunioralves]

Boa dica Frank, pode sim trazer um vídeo sobre Sass.

[@thiagohflima]

Off-topic: tenho tentado descobrir o nome desse tema de ícones há um tempo, podes falar? Parabéns pelos vídeos!

[@devjunioralves]

Mistério revelado: chama Symbol Icons kkkk Muito obrigado!

[@thiagohflima]

@@devjunioralves era esse mesmo, muito obrigado! 👊🏻

[@devjunioralves]

@@thiagohflima Show de bola 👊

[@lucascoliveira3957]

Não entendi pq a context api substituiria um zustand, no Next 13, sendo que com o Zustand, vc resolve o problema de atualizar todos os componentes que estão dentro do mesmo contexto, quando esse contexto precisar ser atualizado. Pelo menos, eu uso o Zustand para conectar dois ou mais componentes, que não possuem ligação, poupando os irmãos e parentes desses componentes de serem atualizados, quando um desses precisa ser atualizado devido ao estado global

[@devjunioralves]

A Context API não substitui o Zustand Lucas, até pq ela não é um state management, já o Zustand é, como digo no vídeo.

[@lucascoliveira3957]

@@devjunioralves mas pq no next13 não precisaríamos de um state manager? Sendo que um, como o Zustand, resolveria esses problemas que citei a cima. Como resolver eles sem o Zustand, usando a context no next13?

[@devjunioralves]

@@lucascoliveira3957 Boa pergunta Lucas, tem vídeos aqui no canal onde eu falo sobre isso. Explico uma forma interessante de utilizar a Context API no Next.js 13 e etc, confere lá, tu vai curtir.

[@AntunesGean]

Apesar de muitos não gostarem, eu sou fan do Redux e rtk, como ele se sai nessa questão. Nunca tinha imaginado isso de re-renderizar a cada mudança. Que bizarro!

[@devjunioralves]

Exatamente, é por que a Context API não é um state management, e usa-la como se fosse, pode trazer vários problemas de performance.

[@devjunioralves]

𝗢𝗦 𝗠𝗘𝗟𝗛𝗢𝗥𝗘𝗦 𝗩𝗜𝗗𝗘𝗢𝗦 𝗗𝗢 𝗖𝗔𝗡𝗔𝗟: 7 CONCEITOS DO TYPESCRIPT QUE VOCÊ DEVE SABE kzbin.info/www/bejne/bXXLnYpofdutqqc Signals no React.js?! kzbin.info/www/bejne/m6CUi6Vvbs12Y5Y QUAL A MELHOR ESTRUTURA DE PASTAS PARA PROJETOS REACT/NEXT.JS kzbin.info/www/bejne/nImzc3iBr8llbMU COMO APLICAR SOLID NO REACT - Inversão de dependência DIP kzbin.info/www/bejne/jGKwZGyegKqSepo [ROADMAP] O QUE VOCÊ DEVERIA ESTUDAR EM 2O23? Fique de olho nessas tecnologias kzbin.info/www/bejne/pGS1Zp-ne5dnnbs TUTORIAL NEXT.JS 13: FETCHING DATA - PARTE 3/3 kzbin.info/www/bejne/fJuYaoljdql1nJo A FORMA CORRETA DE CRIAR ROTAS PRIVADAS NO NEXT.JS 13 - Nova pasta pasta app! kzbin.info/www/bejne/gKSYaYOAqqmDfbs QUANDO NÃO UTILIZAR ESTADOS NO REACT? kzbin.info/www/bejne/q3nbdGt8fZifZ5I MELHORE A USABILIDADE DE SUAS APLICAÇÕES COM ISSO kzbin.info/www/bejne/bZ6uo6Vjd899j5o TUTORIAL NEXT.JS 13: VALE A PENA MIGRAR? PARTE 1/3 kzbin.info/www/bejne/m5y5nZquoJx_grs A FORMA CORRETA DE CRIAR ROTAS PRIVADAS NO NEXT.JS 13 - Nova pasta pasta app! kzbin.info/www/bejne/gKSYaYOAqqmDfbs

[@eduardoernestocorralesreyn7721]

Muito bom o vídeo para conhecer sobre o Zustand, porém não é justo falar da Context API como um vilão. O vídeo deveria começar pelo problema de usar a Context API para guardar estados em lugar de mostrar problemas de performance sem explicar que são artificiais devido a uma arquitetura deficiente (que é muito comum nos desenvolvedores iniciantes e temos que passar por isso para aprender de verdade). O gerenciamento de estados, como vc bem menciona no vídeo, o Zustand faz muito bem, mas nunca podemos esquecer do Redux (principalmente se queremos nos preparar para entrevistas de emprego no exterior). A Context API deveria ser usada para associar esses estados a seções muito específicas da aplicação (contexto), desse jeito isolando-as e impedindo que outras seções possam ver e/ou alterar esses estados. No teu exemplo específico, os contextos de User e Product deveriam ficar por volta somente dos seus respectivos componentes e não de forma global, desse jeito reduzindo as re-renderizações. Realmente comparar a Context API com o Zustand é injusto, porque seus objetivos são diferentes. E falando de gerenciamento de estado, vc já deu uma olhada no useReducer? Esse hook nativo do React resolve esse tema sem precisar de dependências externas. Na minha opinião somente é melhorado pelo próprio Redux. Nos meus projetos estou usando a Context API combinada com useReducer e funcionam perfeitamente. Daria para produzir um bom vídeo com essa ideia. Abraços

[@_Alanfx]

A mesma desvantagem que ocorre quando envolve a aplicação inteira com um provider, também ocorre em componentes/paginas isoladas, haverá componetes rerenderizados sem necessidade.

[@marco_glg]

Teria exemplos de arquiteturas eficientes? um projeto no github por exemplo.

[@marcoglg]

Mas se eu usar o context api como wrapper somente no componente que vai usar as props não daria no mesmo?😅

[@mestihudson]

Legal, mas você trapaceou. Na primeira solução vc usou uma única store para a app toda, quando foi usar o zustand vc criou uma para cada domínio.

[@devjunioralves]

Fala Hudson, tudo bem? Utilizando a Context API, não faz diferença, pois como os providers vão ficar por volta de toda a aplicação e ela não possui um "tracker" para cada state, assim que um alterar, tudo abaixo dela na hierarquia será re-renderizado. Seria sobre isso sua colocação?

[@mestihudson]

@@devjunioralves Exatamente. Obrigado pelo esclarecimento. Parabéns pelo trabalho.

[@devjunioralves]

@@mestihudson Opa, muito obrigado pelo feedback Hudson!!!

[@Snybool]

Galera da Context e do Redux se doendo ai, viva o futuro, vida o Zustand kkkk Adeus context adeus redux

[@SohaaTitanio]

Gosto do assunto dos vídeos, mas são bem longos, as vezes desanima de ver e tornam se cansativos

[@devjunioralves]

Valeu demais pelo feedback, de verdade.

[@ramonStones]

Por que não sabe usar.

[@devjunioralves]

Como?