Frameworks
Find your stack and copy its setup: where the provider goes and how the boundary is keyed.
Choose your rendering framework first, then the helper for your router. Transition factories and route rules are identical everywhere; the provider and boundary wiring differ per stack — Qwik takes a QRL config factory, Angular an ssgoi directive.
React@ssgoi/react
Use SSGOI with React independently of your router. Router helpers are optional conveniences that connect a pathname and a page lifetime to the same React implementation.
Svelte@ssgoi/svelte
The Svelte package provides the common provider and transition API. Add the SvelteKit helper when Kit owns navigation.
Vue@ssgoi/vue
Use the Vue package for the provider and effects. Choose the helper for the router already installed in your app.
Solid@ssgoi/solid
Use the Solid package for common rendering and effects. Solid Router and SolidStart share the same boundary implementation.
Qwik@ssgoi/qwik
Qwik keeps ownership of projected content and serializes state. Supply transition functions through a QRL factory and attach SSGOI to the layout that owns the routed slot.
Angular@ssgoi/angular
Use the common ssgoi directive above the changing page region. The optional Angular Router directive supplies each page’s boundary.
React Native@ssgoi/react-native
Native rendering and UI-thread playback use the same matching and physics concepts, with native fade/slide presets. This native integration remains experimental.
What every stack shares
Once the boundary is wired, the mental model is the same everywhere.
- Route rules choose the navigation relationship.
- Transition factories choose the motion and its variants.
- Boundaries choose the routed region that owns the motion.