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

1. Try navigating between categories and sub categories above.
2. Notice layouts do not re-render (visualized as the a pink border animating to gray) when navigating across sibling routes.
3. Notice client state (visualized as a click counter) is preserved between navigations.
4. Notice you can interact (e.g. click the counter) with the layout while a sibling route is loading.

Links

• Docs
• Code