React e TypeScript

Estado partilhado sem prop drilling

Algumas interações precisam de atravessar a árvore de componentes — um movimento de câmara disparado por scroll ao qual um rodapé, uma barra de navegação e três componentes de secção não relacionados precisam de reagir. Passar isso através de props significaria canalizar estado por componentes a quem, de resto, isso não interessa. Em vez disso, um pequeno repositório tipado ao nível do módulo (um objeto simples com um par `subscribe`/`setActiveIndex`) atua como fonte única de verdade; qualquer componente a quem interesse importa-o diretamente e subscreve-se, qualquer um a quem não interesse nunca lhe toca.

O TypeScript é o que torna esse padrão seguro em vez de frágil — a forma do repositório é uma interface real, por isso um ponto de chamada que erra o contrato (tipo de argumento errado, um nome de método mal escrito) falha em tempo de compilação em vez de não fazer nada silenciosamente em produção.

Os tipos como documentação

As assinaturas de função funcionam também como a documentação de como uma peça de lógica partilhada deve ser usada — um segundo parâmetro opcional numa função de navegação, por exemplo, torna um caminho de reserva "instantâneo, sem animação" descobrível diretamente no ponto de chamada em vez de enterrado num comentário três ficheiros mais à frente.