Loader
Caricamento dinamico di microfrontend via ESM import con cache, dedup delle promise, validazione URL e CSS auto-loading.
Cosa fa il loader
Il modulo @pzeta/mfe-contracts/loader carica dinamicamente bundle MFE remoti in runtime, isolando la shell dalle complessità di:
- dynamic ESM import con
import(url) - validazione URL preventiva (blocca
javascript:,data:,blob:,vbscript:) - caching dei moduli caricati per nome
- deduplica delle richieste concorrenti (stesso
name→ stessa Promise) - CSS auto-loading sibling (
index.js→index.css) - validazione struttura del modulo (
getManifest/mount/unmountobbligatori)
API
| Export | Tipo | Stato |
|---|---|---|
MFELoader | classe | Stable — usa sempre questa |
mfeLoader | istanza singleton | Deprecated — verrà rimosso in major successiva |
Flusso completo
loader.loadRemote({ name, url, scope, module })
│
├─► cache hit? ────► ritorna moduleCached
│
├─► loading in corso? ────► ritorna promiseEsistente
│
└─► nuova richiesta:
│
├─ _validateUrl(url)
│ ├─ blocca data:, javascript:, blob:, vbscript:
│ └─ permette solo http: / https:
│
├─ _loadStylesheet(cssUrl, name)
│ ├─ HEAD request → 404? skip
│ ├─ HEAD ok → <link rel="stylesheet" data-mfe="{name}">
│ └─ wait load/error event
│
├─ import(url) → DynamicModuleExports
│
├─ _validateModule(exports, name)
│ ├─ getManifest(): function ✓
│ ├─ mount(): function ✓
│ ├─ unmount(): function ✓
│ └─ onLoad/onBeforeUnmount/onRouteChange/getViewComponent:
│ se presenti, devono essere function
│
├─ module.onLoad?() (await)
│
└─ cache.set(name, module) e ritorna
Esempio rapido
import { MFELoader, type MFEConfig } from '@pzeta/mfe-contracts'
const loader = new MFELoader()
const config: MFEConfig = {
name: 'crm-module',
url: 'https://mfes.example.com/crm/index.js',
scope: 'crm',
module: './module',
}
const mfe = await loader.loadRemote(config)
const manifest = await mfe.getManifest()
console.log(manifest.name, manifest.version)
Quando rimuovere dalla cache
- Hot reload in development:
loader.clearCache(name)oloader.clearAllCache() - Aggiornamento manifest in produzione: dopo
unmount(),clearCache(name)per ricaricare la versione nuova - Logout:
clearAllCache()per sbarazzarsi di moduli caricati con token vecchio