Parallel routing allows you to simultaneously render one or more pages in the same layout.
Interactive Simulation Engine
Parallel Routing Lab
Independent Slot Rendering
@analytics
children (main)
@team
Key takeaway: Parallel slots render simultaneously but load at their own pace. Notice how "Analytics" can finish while "Team" is still loading.
Executable Code Workbench
page.tsx
Live Code Editor1// app/dashboard/layout.tsx
2export default function Layout({
3 children,
4 analytics,
5 team
6}) {
7 return (
8 <div className="flex">
9 {children}
10 {analytics}
11 {team}
12 </div>
13 )
14}Mental Model
A split-screen view. You can have a dashboard with a '@team' section and an '@analytics' section that load independently.
Why This Exists
To create highly complex layouts like dashboards where different sections have their own loading and error states.
Critical Note
"Parallel routes share the same state. No, each slot maintains its own state and can be navigated independently, but refreshing the page will always attempt to match the current URL for all slots."