single-spa/single-spa
Single Spa
single-spa is a microfrontend orchestration framework designed to compose multiple independent frontend applications into a single interface. It functions as a frontend routing engine and lazy-loading application loader that mounts and unmounts microfrontends based on the current URL without requiring a browser refresh.
The framework enables multi-framework frontend integration, allowing different JavaScript frameworks to coexist on one page. This architecture supports distributed frontend development, where separate teams develop and deploy modules independently while maintaining a unified user experience.
The system manages the lifecycle of these applications through a centralized registry and dynamic module loading. It optimizes frontend performance by deferring the download of application code until a specific route is accessed.
Features
- Micro-Frontend Orchestrators - Functions as a micro-frontend orchestrator that composes multiple autonomous web applications into a single unified interface.
- Framework Coexistence - Enables the coexistence of multiple different JavaScript frameworks on a single page through an agnostic wrapper.
- URL Route Mapping - Maps browser URL changes to specific microfrontend configurations to trigger application loading and activation.
- Dynamic Loading Strategies - Implements dynamic loading strategies to fetch JavaScript bundles on demand, reducing the initial page payload.
- Lazy Loading - Defers the download of application code until the specific route is accessed to optimize page load times.
- Microfrontend Routers - Acts as a frontend routing engine that mounts and unmounts microfrontends based on the current URL.
- Micro-Frontend Frameworks - Integrates multiple different JavaScript frameworks to coexist on a single page without browser refreshes.
- Application Registries - Provides a centralized registry to manage the activation and inactivation logic of registered microfrontend applications.
- Microfrontend Lifecycles - Manages the mounting and unmounting of micro frontends via standardized lifecycle functions.
- Distributed Frontend Development - Supports distributed development workflows where separate teams deploy modules independently while maintaining a unified experience.
- Frontend Performance Optimization - Optimizes frontend performance by delaying application code downloads until they are needed.
