Skip to content

Loading with parallel routes only works on root #72850

@bananashell

Description

@bananashell

Link to the code that reproduces this issue

https://github.com/bananashell/nextjs-parallel-route-loading-issue

To Reproduce

  1. next dev
  2. hard reload localhost:3000 (loading of header is done as expected)
  3. hard reload localhost:3000/a
  4. loading of header is skipped and entier page results in being sync

Current vs. Expected behavior

If a loading.tsx is added to the root of a parallel route it only uses that suspense boundary on the root level.

Give this tree

/ (root)
    @header
        page.tsx
        default.tsx
        loading.tsx
    /a
        page.tsx
        loading.tsx
    /b
        page.tsx
        loading.tsx
  • navigating to / will use the loading.tsx if @header/page.tsx is async
  • navigating to /adirectly would not use the loading.tsx for @header and prevent streaming from happening

The only solution I've found for this is to manually add a Suspense boundary to default.tsx

// @header/default.tsx
import HeaderSlot from "./page";
import { Suspense } from "react";
import Loading from "./loading";

export default function DefaultSlot() {
    return (
        <Suspense fallback={<Loading />}>
            <HeaderSlot />
        </Suspense>
    );
}

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: unknown
  Available memory (MB): 36864
  Available CPU cores: 14
Binaries:
  Node: 22.6.0
  npm: N/A
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 15.0.3 // Latest available version is detected (15.0.3).
  eslint-config-next: N/A
  react: 18.3.1
  react-dom: 18.3.1
  typescript: N/A
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Parallel & Intercepting Routes

Which stage(s) are affected? (Select all that apply)

next dev (local), next start (local)

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Parallel & Intercepting RoutesRelated to Parallel and/or Intercepting routes.bugIssue was opened via the bug report template.

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions