Introduction
Aiga — Next-generation micro-frontend framework with adaptive sandbox architecture.
Aiga is a micro-frontend framework that lets you embed independent web applications into a host page with adaptive isolation levels, typed cross-app communication, and automatic overlay handling — all through a single <aiga-app> Web Component.
Key Ideas
- Adaptive Sandbox Architecture — 4 isolation tiers (
none,light,strict,remote) so you choose the right trade-off per sub-app. <aiga-app>Web Component — Works in React, Vue, Angular, Svelte, or vanilla HTML.- Pre-warmed iframe Pool — Near-instant (~0ms) iframe acquisition with LRU eviction.
- Typed RPC Channel — Promise-based
postMessagewith timeout handling and type safety. - Overlay Teleportation — Modals and popovers escape Shadow DOM and iframe boundaries automatically.
- Built-in Router — URL-based routing with nested routes, dynamic params, guards, and
<aiga-view>.
Quick Start
<script type="module">
import { initAiga } from 'aiga';
initAiga();
</script>
<!-- That's it. Now use it anywhere: -->
<aiga-app src="https://dashboard.app/" sandbox="strict" keep-alive />
<aiga-app src="https://settings.app/" sandbox="light" />
<aiga-app src="https://widget.cdn.com/" sandbox="remote" />Architecture at a Glance
| Component | Purpose |
|---|---|
<aiga-app> | Unified entry point — load, mount, unmount sub-apps |
| Sandbox Adapters | 4 implementations: None, Light, Strict, Remote |
| iframe Pool | Pre-warmed pool with LRU + keep-alive manager |
| RPC Channel | Typed request/response over postMessage |
| Overlay Layer | Teleport or promote overlays for correct rendering |
| Router | URL-based routing with <aiga-view> |
| Service Worker | Cross-iframe resource caching |
Explore the sidebar to learn more about each component, or jump to the interactive demos to see everything in action.