mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
Zack TannerandGitHub
86cbc1f526
This introduces an experimental router flag (`experimental.staleTimes`)
to change the router cache behavior. Specifically:
```ts
// next.config.js
module.exports = {
experimental: {
staleTimes: {
dynamic: <seconds>,
static: <seconds>,
},
},
};
```
- `dynamic` is the value that is used when the `prefetch` `Link` prop is
left unspecified. (Default 30 seconds)
- `static` is the value that is used when the `prefetch` `Link` prop is
`true`. (Default 5 minutes)
Additional details:
- Loading boundaries are considered reusable for the time period
indicated by the `static` property (default 5 minutes)
- This doesn't disable partial rendering support, **meaning shared
layouts won't automatically be refetched every navigation, only the new
segment data**.
- This also doesn't change back/forward caching behavior to ensure
things like scroll restoration etc still work nicely.
Please see the original proposal
[here](https://github.com/vercel/next.js/discussions/54075#discussioncomment-6754339)
for more information. The primary difference is that this is a global
configuration, rather than a per-segment configuration, and it isn't
applied to layouts. (We expect this to be a "stop-gap" and not the final
router caching solution)
Closes NEXT-2703
37 lines
970 B
JavaScript
37 lines
970 B
JavaScript
import Link from 'next/link'
|
|
|
|
export default function Page() {
|
|
return (
|
|
<>
|
|
<div>
|
|
<Link href="/without-loading/0?timeout=0" prefetch={true}>
|
|
To Random Number - prefetch: true
|
|
</Link>
|
|
</div>
|
|
<div>
|
|
<Link href="/without-loading/0?timeout=1000" prefetch={true}>
|
|
To Random Number - prefetch: true, slow
|
|
</Link>
|
|
</div>
|
|
<div>
|
|
<Link href="/without-loading/1">To Random Number - prefetch: auto</Link>
|
|
</div>
|
|
<div>
|
|
<Link href="/without-loading/2" prefetch={false}>
|
|
To Random Number 2 - prefetch: false
|
|
</Link>
|
|
</div>
|
|
<div>
|
|
<Link href="/without-loading/2?timeout=1000" prefetch={false}>
|
|
To Random Number 2 - prefetch: false, slow
|
|
</Link>
|
|
</div>
|
|
<div>
|
|
<Link href="/without-loading/1?timeout=1000">
|
|
To Random Number - prefetch: auto, slow
|
|
</Link>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|