A maneira mais simples de criar estados globais compartilhados no React usando um modelo atômico simples. Neste blog, você encontrará os detalhes de uso e implementação da biblioteca.

Uso

Crie seu estado global

import { gState } from 'usegstate'

const myGlobalState = gState('hello-world!')

import useGState from 'usegstate'

const YourAwesomeApp = () => {
  const [gState,setGState] = useGState(myGlobalState)
  return (
    <div>{gState}</div>
  )
}

import {GStateProvider} from 'usegstate'

const Wrapper = () => {
  return (
    <GStateProvider>
      <YourAwesomeApp />
    </GStateProvider>
  )
}

Por que não React Context API?

Como sabemos, o React Context renderiza novamente cada filho sempre que o estado compartilhado muda em qualquer componente filho, causando renderizações extras e problemas de desempenho em alguns casos.

Motivação

Sempre tive curiosidade sobre como funcionam essas bibliotecas externas de estado central, como redux , jotai , etc. Parece que eles estão usando algum tipo de superpotência que os permite criar esses armazenamentos centrais externos, que são completamente isolados do fluxo unidirecional do react.

E depois de examinar seus enormes códigos-fonte, encontrei a chave. A única coisa que realmente amplia a amplitude do meu conhecimento de reação.

Idéia-chave de useGState — Como funciona.

As funções de setter de estado do React, como a função setter de useState() ou a função de despacho de useReducer(), podem acessar/modificar estados fora do fluxo unidirecional do react.

Em palavras simples, podemos acessar/modificar o estado de reação em funções js normais usando essa ideia-chave. Agora podemos criar um armazenamento global central externo usando essas funções.

Descanse tudo é simples. Basta implementar um mecanismo de sincronização como o pub-sub para assinar as alterações de estado da loja global.

useGState é um pacote educacional que permite aos desenvolvedores entender profundamente como reagir.

Se você achar essas informações úteis, conecte-se comigo no LinkedIn para obter mais conteúdo desse tipo.