Condivisione della tecnologia

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Il micro framework front-end illimitato è una soluzione micro front-end basata su componenti Web + iframe. Presenta una serie di vantaggi come basso costo, alta velocità, isolamento nativo e funzioni potenti. Quella che segue è un'introduzione dettagliata al framework micro front-end illimitato:

1. Contesto e panoramica

Il micro front-end è un mezzo tecnico e una strategia metodologica che consente a più team di costruire congiuntamente moderne applicazioni web pubblicando funzioni in modo indipendente. Il framework micro front-end illimitato fornisce agli sviluppatori una soluzione micro front-end efficiente e flessibile introducendo componenti Web e tecnologia iframe. Questo framework mira a risolvere le principali richieste degli utenti delle soluzioni micro front-end esistenti in termini di costi di adattamento, isolamento dello stile, prestazioni di esecuzione, schermata bianca della pagina, comunicazione delle sotto-applicazioni, keep-alive delle sotto-applicazioni, attivazione di più applicazioni, Vite supporto del framework, condivisione di applicazioni, ecc. Il problema.

2. Funzionalità principali

1. basso costo: L'applicazione principale del framework micro front-end illimitato ha costi di utilizzo bassi e anche il costo di adattamento delle sottoapplicazioni è relativamente basso.
2. ad alta velocità : La prima schermata dell'applicazione secondaria si apre rapidamente e l'applicazione secondaria viene eseguita rapidamente. Ciò è dovuto alla gestione ottimizzata delle risorse e alla strategia di precaricamento del framework illimitato.
3. isolamento nativo : gli stili CSS possono ottenere un rigoroso isolamento nativo tramite i componenti Web e anche JS in esecuzione in iframe raggiunge un rigoroso isolamento nativo. Questo meccanismo di isolamento garantisce l'indipendenza tra le sottoapplicazioni ed evita conflitti di stile e conflitti di script.
4. Potente : Il framework micro front-end illimitato supporta il mantenimento in vita delle sotto-applicazioni, l'annidamento delle sotto-applicazioni, l'attivazione di più applicazioni, la condivisione delle applicazioni, la comunicazione decentralizzata, ecc. Queste funzionalità rendono il framework illimitato più flessibile e scalabile quando si tratta di applicazioni front-end complesse.

3. Implementazione tecnica

Il framework micro front-end illimitato adotta la modalità sandbox di Web Components + iframe e raggiunge l'isolamento nativo e un funzionamento efficiente ereditando i vantaggi di iframe e risolvendone i difetti. I metodi di implementazione specifici includono:

1. Crea un iframe che abbia la stessa origine dell'applicazione principale: Il percorso trasporta le informazioni di instradamento dei sottopercorsi. La stessa origine serve a facilitare la comunicazione tra le applicazioni.
2. Analizzare la voce HTML della sottoapplicazione: Identificare la parte HTML, separare style e js; elaborare css e reinserire html; creare webComponent e montare html;
3. Intercetta l'oggetto documento in iframe: Punta DOM su shadowRoot in modo unificato per risolvere il problema delle finestre pop-up o dei componenti che formano bolle che non sono in grado di coprire l'applicazione principale.
4. meccanismo di comunicazione: L'iframe e l'applicazione principale si trovano nello stesso dominio e condividono naturalmente la memoria per la comunicazione. Unbounded fornisce un meccanismo di eventi decentralizzato per risolvere i problemi di comunicazione.
5. Gestione dello stato del percorso: Il movimento avanti e indietro del browser può naturalmente influenzare l'iframe. In questo momento, le modifiche al routing dell'iframe vengono monitorate e sincronizzate con l'applicazione principale. Se il browser viene aggiornato, il percorso salvato può essere riletto dall'URL .

4. Vantaggi e applicazioni

I vantaggi del framework micro front-end illimitato sono il basso costo, l'alta velocità, l'isolamento nativo e le potenti funzionalità. Ciò offre un vantaggio significativo quando si ha a che fare con applicazioni front-end grandi e complesse. Allo stesso tempo, il framework illimitato supporta anche una varietà di stack tecnologici front-end, come Vue, React, ecc., consentendo agli sviluppatori di scegliere in modo flessibile gli stack tecnologici in base alle esigenze del progetto.

In termini di scenari applicativi, il framework micro front-end illimitato è adatto per applicazioni web su larga scala che richiedono sviluppo collaborativo efficiente, distribuzione indipendente e aggiornamenti. Introducendo il framework illimitato, gli sviluppatori possono suddividere le applicazioni front-end in più applicazioni micro-front-end indipendenti e ciascuna applicazione può essere sviluppata, testata e distribuita in modo indipendente. Ciò non solo migliora l’efficienza dello sviluppo, ma riduce anche la complessità e i rischi del progetto.