mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
Andrew ClarkandGitHub
dfa7f4f713
If we're reasonably confident that a segment can be prefetched statically without omitting data that would have been included during a runtime prefetch (e.g. cookies), the client should attempt prefetch the segment statically instead of going straight to a runtime request. The decision for whether to do this is based on the ShouldAttemptStaticPrefetch added in previous steps. If it turns out the static response is not sufficient, then it will fall back to a runtime request. This makes prefetching cheaper for pages that are fully statically renderable. We can make the optimization better in the future with more reliable per-segment computation of the ShouldAttemptStaticPrefetch, but the current approach should at least work for fully static pages, which is what's most important. This optimization applies during both the Shell phase and the Speculative phase of the prefetching algorithm.
25 lines
812 B
TypeScript
25 lines
812 B
TypeScript
import { Suspense } from 'react'
|
|
import { cookies } from 'next/headers'
|
|
|
|
// A page that reads cookies directly in the shell: every prerender records a
|
|
// runtime-data access during its shell stage, so the route tree prefetch
|
|
// never carries the static-prefetch hint. The client should go straight to a
|
|
// runtime shell prefetch without attempting a static one.
|
|
|
|
async function CookieContent() {
|
|
const cookieStore = await cookies()
|
|
const value = cookieStore.get('testCookie')?.value ?? 'none'
|
|
return <div id="cookie-content">{`Cookie value: ${value}`}</div>
|
|
}
|
|
|
|
export default function Page() {
|
|
return (
|
|
<main>
|
|
<p id="page-content">Cookies page shell text</p>
|
|
<Suspense fallback={<p id="cookie-loading">Loading cookie...</p>}>
|
|
<CookieContent />
|
|
</Suspense>
|
|
</main>
|
|
)
|
|
}
|