As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.

Gerenciando dependências para questões transversais

O gerenciamento consciente de dependências é crucial para o sucesso de uma arquitetura distribuída, como microfront-ends. O gerenciamento de dependências é uma das partes mais desafiadoras do desenvolvimento de microfront-ends.

Em uma arquitetura de microfront-end, dois aspectos importantes do gerenciamento de dependências são a penalidade de desempenho decorrente da transferência de grandes artefatos de código para o cliente e a sobrecarga nos recursos computacionais. Idealmente, sua organização precisa determinar como as dependências em uma arquitetura de front-end distribuída são mantidas.

Três estratégias viáveis para exigir a manutenção de dependências são não compartilhar nada, usando padrões da web, como mapas de importação e federação de módulos. Outras abordagens são antipadrões porque violam os princípios básicos das arquiteturas distribuídas.

Não compartilhe nada, sempre que possível

A abordagem de não compartilhar nada postula que nenhuma dependência entre artefatos de software independentes deve ser compartilhada, ou pelo menos não na integração ou no tempo de execução. Isso significa que, se dois microfront-ends dependerem da mesma biblioteca, cada um deverá ser incorporado na biblioteca no momento da construção e enviá-la separadamente. Além disso, cada microfrontend deve validar que a biblioteca não polui namespaces globais e recursos compartilhados.

Isso leva a redundâncias, mas é uma troca consciente com a máxima agilidade. Sem dependências de tempo de execução compartilhadas, as equipes têm a máxima flexibilidade para desenvolver o software da maneira que acharem útil, desde que façam isso no escopo de sua solução e não quebrem nenhum contrato de interface.

Em uma plataforma em que os microfrontends seguem o princípio de não compartilhar nada, é importante manter os microfront-ends o mais leves possível. Isso requer desenvolvedores qualificados e diligentes na otimização de seus microfront-ends para desempenho e que não sacrifiquem a experiência do usuário pela experiência do desenvolvedor.

Quando você compartilha o código

Ao tomar a decisão de compartilhar algum código, você pode compartilhá-lo como bibliotecas ou módulos de tempo de execução. Por exemplo, a equipe principal de front-end fornece bibliotecas para consumo de microfront-end por meio de. CDNs As equipes de valor comercial podem carregar as bibliotecas em tempo de execução ou podem usar repositórios de pacotes para publicar suas bibliotecas. As equipes de microfrontend podem desenvolver com base em uma versão específica da biblioteca empacotada no momento da construção, de forma semelhante aos aplicativos móveis que usam estruturas híbridas.

Uma terceira opção é usar um registro de pacotes privado para oferecer suporte à integração em tempo de construção de bibliotecas comuns. Isso reduz o risco de que uma alteração significativa no contrato da biblioteca inicie erros em tempo de execução. No entanto, essa abordagem mais conservadora exige mais governança para sincronizar todos os microfront-ends com as versões mais recentes da biblioteca.

Para melhorar os tempos de carregamento da página, os microfrontends podem externalizar as dependências da biblioteca a serem carregadas a partir de partes em cache de uma CDN como a Amazon. CloudFront

Para gerenciar dependências de tempo de execução, os microfrontends podem usar mapas de importação (ou bibliotecas comoSystem.js) para especificar de onde cada módulo é carregado em tempo de execução. O webpack Module Federation é outra abordagem para apontar para uma versão hospedada de um módulo remoto e resolver dependências comuns em microfrontends independentes.

Outra abordagem é facilitar o carregamento dinâmico de mapas de importação com uma solicitação inicial para um endpoint de descoberta.

Estado compartilhado

Para reduzir o acoplamento de microfront-ends, é importante evitar um gerenciamento de estado global acessível a partir de todos os microfront-ends na mesma visualização, semelhante às arquiteturas monolíticas. Por exemplo, ter uma loja Redux global acessível a partir de todos os microfront-ends aumenta o acoplamento.

Um padrão para eliminar o estado compartilhado é encapsulá-lo em microfront-ends e comunicar-se com mensagens assíncronas, conforme discutido anteriormente.

Quando for absolutamente necessário, introduza interfaces bem definidas para o estado global e opte pelo compartilhamento somente leitura para evitar comportamentos inesperados:

Se você precisar compartilhar várias informações entre microfront-ends, recomendamos revisitar os limites do microfrontend. A necessidade de compartilhar pode ser causada pela evolução dos negócios ou por um design inicial abaixo da média.

Também é possível usar sessões do lado do servidor, em que cada microfrontend busca os dados necessários usando um identificador de sessão. Para reduzir o acoplamento, é importante eliminar o estado compartilhado e manter separados os dados específicos da sessão do microfrontend.