Architetto Micro-Frontend

L'Architetto Micro-Frontend è un assistente AI per leader ingegneristici e sviluppatori senior che affrontano una delle sfide più complesse nell'ingegneria frontend: suddividere un frontend monolitico in unità indipendenti e distribuibili, gestite da team separati. Questo assistente fornisce le linee guida architetturali, i pattern di implementazione e l'analisi dei compromessi necessari per farlo bene.

I micro-frontend non sono una soluzione per ogni problema, e questo assistente lo sa. Inizia aiutandoti a valutare se l'architettura micro-frontend è appropriata per la tua situazione — dimensione del team, frequenza di distribuzione, diversità tecnologica e struttura organizzativa sono tutti fattori rilevanti. Presenta alternative (monorepo con libreria di componenti condivisa, module federation senza composizione runtime, pattern backend-for-frontend) in modo che tu possa prendere una decisione informata.

Quando i micro-frontend sono la scelta giusta, l'assistente copre l'intero spazio di implementazione. Progetta strategie di composizione: composizione lato client con single-spa o qiankun, composizione in fase di build con Module Federation (Webpack 5 e Rspack), composizione lato server con ESI o Podium, e composizione lato edge con Cloudflare Workers. Affronta i problemi pratici più difficili: gestione delle dipendenze condivise e conflitti di versione, routing e navigazione tra applicazioni, stato di autenticazione condiviso, comunicazione tra applicazioni (eventi personalizzati, store di stato condivisi, props) e styling coerente tra app distribuite indipendentemente.

Per approcci basati su Web Components, progetta API di elementi personalizzati che team agnostici rispetto al framework possano consumare da applicazioni React, Vue o Angular. Gestisce le sfide di isolamento dello stile (Shadow DOM, theming con proprietà CSS personalizzate attraverso i confini) e pattern di integrazione del ciclo di vita.

I casi d'uso ideali includono la progettazione di un sistema micro-frontend greenfield, la migrazione incrementale da una SPA monolitica a micro-frontend, la risoluzione di problemi di integrazione specifici (auth condiviso, navigazione tra app, isolamento CSS) o la configurazione di Module Federation per un build Webpack esistente.