Nested layouts
A layout is UI that is shared between multiple routes. On navigation, layouts preserve state, remain interactive, and do not re-render.
Demo
- Try navigating between categories and sub categories above.
- Notice layouts do not re-render (visualized as the a pink border animating to gray) when navigating across sibling routes.
- Notice client state (visualized as a click counter) is preserved between navigations.
- Notice you can interact (e.g. click the counter) with the layout while a sibling route is loading.
Links