AI & Agent Dev Bug Sandbox logo
AI & Agent Dev Bug Sandbox
Back to Radar

Prefetched Optional Catch-All Index Page Cached Under Fallback Slug Causes Wrong Sibling Route Render

When prefetching the index page of an optional catch-all dynamic route, the client caches the __PAGE__ entry under a fallback slug. Subsequent navigation to a sibling dynamic path reuses this cached entry without issuing a new request, causing the wrong page content to be displayed.

highConfidence 85%Next.jsAffected V16.4.0-Canary.60

Origin Analysis

The client-side router cache matching logic treats a fulfilled prefetch entry for '/' (optional catch-all index) as a valid fallback for any dynamic path under the same route group. The cache key does not sufficiently distinguish between routes that require a dynamic segment and the static fallback representation of the index, leading to stale data being served when navigating to '/b' or similar paths.
1. Clone https://github.com/nickolaj-jepsen/next-catchall-varyparams-repro 2. Run `npm install && npm run build && npm start` 3. Open the application in a browser 4. Navigate to /a and wait for <Link href="/" prefetch={true}> to complete prefetching 5. Click the link to /b 6. Observe that the URL changes to /b but the page content remains the index page instead of rendering 'Page /b'

Fixing Code Block

Edge Case Audit

This patch relies on comparing path segment counts, which may not cover all route patterns (e.g., nested optional catch-all, or routes with query-only distinctions). In complex route structures, false positives or negatives could occur. If the route matcher is not used for exact pattern comparison, dynamic routes with the same segment count but different parameter names may still be incorrectly cached. The change could also introduce a slight performance overhead due to extra URL parsing in the navigation hot path. Before deploying, thoroughly test with various optional catch-all patterns, query parameters, and client-side transitions. If regressions appear, rollback this specific validation and consider a more robust cache key that includes all dynamic params. Ensure the fix is compatible with both React Server Components and legacy pages router.

Ecosystem Topology