Files
Andrew ClarkandGitHub f17694d61f Optimistic routing: client-side route prediction (#88965)
Based on:

- https://github.com/vercel/next.js/pull/88834
- https://github.com/vercel/next.js/pull/88989
- https://github.com/vercel/next.js/pull/88998

---

Adds optimistic routing, enabling the client to predict route structure
for URLs that haven't been prefetched yet. When navigating to a URL like
/blog/post-2, if we've previously learned the pattern from /blog/post-1,
we can predict the route structure without waiting for a server
response.

The client learns route patterns from server responses and builds a trie
indexed by URL parts. When a cache miss occurs, we check if the URL
matches a known pattern. If so, we create a synthetic cache entry from
the template, allowing immediate rendering of loading boundaries.

Static siblings (like /blog/featured alongside /blog/[slug]) are tracked
to avoid incorrect predictions — we only predict dynamic routes when
we're confident no static sibling matches.
2026-01-29 17:05:28 -05:00

21 lines
496 B
TypeScript

'use client'
import { Suspense } from 'react'
import { useParams } from 'next/navigation'
function LoadingWithParams() {
const params = useParams<{ path: string[] }>()
const filePath = params.path.join('/')
return <p id="loading-message">Loading file {filePath}...</p>
}
export default function Loading() {
return (
<div id="loading-boundary">
<Suspense fallback={<p id="loading-message">Loading file...</p>}>
<LoadingWithParams />
</Suspense>
</div>
)
}