Skip to content

add experimental client router cache config#62856

Merged
ztanner merged 4 commits intocanaryfrom
03-04-add_experimental_client_router_cache_config
Apr 2, 2024
Merged

add experimental client router cache config#62856
ztanner merged 4 commits intocanaryfrom
03-04-add_experimental_client_router_cache_config

Conversation

@ztanner
Copy link
Member

@ztanner ztanner commented Mar 5, 2024 •
edited
Loading

This introduces an experimental router flag (experimental.staleTimes) to change the router cache behavior. Specifically:

// 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 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

@ijjk ijjk added created-by: Next.js team PRs by the Next.js team. type: next labels Mar 5, 2024
This was referenced Mar 5, 2024
Merged
Merged
Closed
@ztanner Graphite App
Copy link
Member Author

ztanner commented Mar 5, 2024 •
edited
Loading

This stack of pull requests is managed by Graphite. Learn more about stacking.

Join @ztanner and the rest of your teammates on Graphite Graphite

@ijjk
Copy link
Member

ijjk commented Mar 5, 2024 •
edited
Loading

Tests Passed

@ztanner ztanner force-pushed the 02-21-Expire_loading_state_cache_separately_from_cache_node_data branch from 964927d to ff5bc7d Compare March 5, 2024 02:04
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch 2 times, most recently from b3d3302 to 98f5d0d Compare March 5, 2024 15:33
@ijjk
Copy link
Member

ijjk commented Mar 5, 2024 •
edited
Loading

Stats from current PR

Default Build (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
buildDuration 14s 14s N/A
buildDurationCached 7.6s 6.2s N/A
nodeModulesSize 199 MB 199 MB ⚠️ +10.7 kB
nextStartRea..uration (ms) 402ms 396ms N/A
Client Bundles (main, webpack)
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
2453-HASH.js gzip 31.4 kB 31.3 kB N/A
3304.HASH.js gzip 181 B 181 B ✓
3f784ff6-HASH.js gzip 53.7 kB 53.7 kB ✓
8299-HASH.js gzip 5.04 kB 5.04 kB N/A
framework-HASH.js gzip 45.2 kB 45.2 kB ✓
main-app-HASH.js gzip 240 B 242 B N/A
main-HASH.js gzip 32.2 kB 32.2 kB N/A
webpack-HASH.js gzip 1.68 kB 1.68 kB N/A
Overall change 99 kB 99 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
polyfills-HASH.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
_app-HASH.js gzip 196 B 197 B N/A
_error-HASH.js gzip 184 B 184 B ✓
amp-HASH.js gzip 505 B 505 B ✓
css-HASH.js gzip 324 B 325 B N/A
dynamic-HASH.js gzip 2.5 kB 2.5 kB N/A
edge-ssr-HASH.js gzip 258 B 258 B ✓
head-HASH.js gzip 352 B 352 B ✓
hooks-HASH.js gzip 370 B 371 B N/A
image-HASH.js gzip 4.21 kB 4.21 kB ✓
index-HASH.js gzip 259 B 259 B ✓
link-HASH.js gzip 2.67 kB 2.67 kB N/A
routerDirect..HASH.js gzip 314 B 312 B N/A
script-HASH.js gzip 386 B 386 B ✓
withRouter-HASH.js gzip 309 B 309 B ✓
1afbb74e6ecf..834.css gzip 106 B 106 B ✓
Overall change 6.57 kB 6.57 kB ✓
Client Build Manifests
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
_buildManifest.js gzip 481 B 484 B N/A
Overall change 0 B 0 B ✓
Rendered Page Sizes
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
index.html gzip 530 B 528 B N/A
link.html gzip 541 B 540 B N/A
withRouter.html gzip 525 B 522 B N/A
Overall change 0 B 0 B ✓
Edge SSR bundle Size
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
edge-ssr.js gzip 95.3 kB 95.4 kB N/A
page.js gzip 3.04 kB 3.06 kB N/A
Overall change 0 B 0 B ✓
Middleware size
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
middleware-b..fest.js gzip 627 B 625 B N/A
middleware-r..fest.js gzip 151 B 151 B ✓
middleware.js gzip 25.5 kB 25.5 kB N/A
edge-runtime..pack.js gzip 839 B 839 B ✓
Overall change 990 B 990 B ✓
Next Runtimes
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
app-page-exp...dev.js gzip 170 kB 170 kB ✓
app-page-exp..prod.js gzip 97 kB 97 kB ✓
app-page-tur..prod.js gzip 98.8 kB 98.8 kB ✓
app-page-tur..prod.js gzip 93 kB 93 kB ✓
app-page.run...dev.js gzip 144 kB 144 kB ✓
app-page.run..prod.js gzip 91.5 kB 91.5 kB ✓
app-route-ex...dev.js gzip 21.4 kB 21.4 kB ✓
app-route-ex..prod.js gzip 15.1 kB 15.1 kB ✓
app-route-tu..prod.js gzip 15.1 kB 15.1 kB ✓
app-route-tu..prod.js gzip 14.8 kB 14.8 kB ✓
app-route.ru...dev.js gzip 21 kB 21 kB ✓
app-route.ru..prod.js gzip 14.8 kB 14.8 kB ✓
pages-api-tu..prod.js gzip 9.55 kB 9.55 kB ✓
pages-api.ru...dev.js gzip 9.82 kB 9.82 kB ✓
pages-api.ru..prod.js gzip 9.55 kB 9.55 kB ✓
pages-turbo...prod.js gzip 22.5 kB 22.5 kB ✓
pages.runtim...dev.js gzip 23.1 kB 23.1 kB ✓
pages.runtim..prod.js gzip 22.4 kB 22.4 kB ✓
server.runti..prod.js gzip 51 kB 51 kB ✓
Overall change 944 kB 944 kB ✓
build cache Overall increase ⚠️
vercel/next.js canary vercel/next.js 03-04-add_experimental_client_router_cache_config Change
0.pack gzip 1.58 MB 1.58 MB ⚠️ +1.83 kB
index.pack gzip 106 kB 106 kB N/A
Overall change 1.58 MB 1.58 MB ⚠️ +1.83 kB
Diff details
Diff for page.js

Diff too large to display

Diff for middleware.js

Diff too large to display

Diff for edge-ssr.js

Diff too large to display

Diff for 2453-HASH.js

Diff too large to display

Commit: 3098fd1

@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from 98f5d0d to 372bacb Compare March 5, 2024 15:43
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from 4cb8f43 to bde812e Compare March 5, 2024 21:40
@ztanner ztanner changed the title (wip) add experimental client router cache config add experimental client router cache config Mar 5, 2024
@ztanner ztanner marked this pull request as ready for review March 5, 2024 22:19
@ztanner ztanner force-pushed the 02-21-Expire_loading_state_cache_separately_from_cache_node_data branch from ff5bc7d to af906b6 Compare March 5, 2024 22:23
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from bde812e to 042fda8 Compare March 5, 2024 22:23
AkifumiSato
AkifumiSato reviewed Mar 6, 2024
View reviewed changes
@ztanner ztanner marked this pull request as draft March 6, 2024 20:52
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from 042fda8 to 1413c39 Compare March 6, 2024 22:47
@ztanner ztanner force-pushed the 02-21-Expire_loading_state_cache_separately_from_cache_node_data branch 2 times, most recently from 9200fd8 to 0d8d595 Compare March 6, 2024 23:18
@ztanner ztanner marked this pull request as ready for review March 13, 2024 21:20
@ztanner ztanner force-pushed the 03-13-Fix_instant_loading_states branch from 8546e49 to 2adea1d Compare March 15, 2024 19:53
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from da39e05 to f6cccd0 Compare March 15, 2024 19:53
@ztanner ztanner force-pushed the 03-13-Fix_instant_loading_states branch from 2adea1d to be44437 Compare March 18, 2024 14:47
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from f6cccd0 to 4e9566a Compare March 18, 2024 14:47
Base automatically changed from 03-13-Fix_instant_loading_states to canary March 19, 2024 19:02
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from 4e9566a to c0fdedb Compare March 27, 2024 00:28
@jrnxf
Copy link

jrnxf commented Mar 27, 2024

may I kindly ask this receive some attention? a lot of us are waiting on this!

@Enngage
Copy link

Enngage commented Mar 28, 2024

same here. Would be nice if this got merged and released

@Cnsbmkpsr
Copy link

Cnsbmkpsr commented Mar 28, 2024

Same here, this fix is very important

@eremenko1
Copy link

eremenko1 commented Mar 28, 2024

upd pls

@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch 3 times, most recently from a460ea6 to 5d280ab Compare March 28, 2024 20:24
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch 2 times, most recently from 58f79f0 to c31c2c0 Compare March 28, 2024 20:52
@ztanner ztanner force-pushed the 03-04-add_experimental_client_router_cache_config branch from c31c2c0 to 3098fd1 Compare March 28, 2024 21:00
@ztanner ztanner mentioned this pull request Mar 30, 2024
Closed
@ztanner ztanner merged commit 86cbc1f into canary Apr 2, 2024
@ztanner ztanner deleted the 03-04-add_experimental_client_router_cache_config branch April 2, 2024 12:42
@ztanner ztanner mentioned this pull request Apr 3, 2024
Merged
ztanner added a commit that referenced this pull request Apr 4, 2024
@ztanner
docs: add experimental staleTimes resource (#64040)
5c29e93 
This documents the behavior introduced in #62856 to allow globally
overriding the router cache invalidation period.

`static` and `dynamic` in this case refer to variable levels of
"liveness" and are unrelated to whether the segment itself is opting
into static or dynamic rendering. In other words, the current `dynamic`
default of 30s suggests that we consider the 30s delta to feel dynamic
while still providing some caching for performance reasons. Others might
prefer a value of 0s here, hence the configuration.

<!-- Thanks for opening a PR! Your contribution is much appreciated.
To make sure your PR is handled as smoothly as possible we request that
you follow the checklist sections below.
Choose the right checklist for the change(s) that you're making:

## For Contributors

### Improving Documentation

- Run `pnpm prettier-fix` to fix formatting issues before opening the
PR.
- Read the Docs Contribution Guide to ensure your contribution follows
the docs guidelines:
https://nextjs.org/docs/community/contribution-guide

### Adding or Updating Examples

- The "examples guidelines" are followed from our contributing doc
https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md
- Make sure the linting passes by running `pnpm build && pnpm lint`. See
https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md

### Fixing a bug

- Related issues linked using `fixes #number`
- Tests added. See:
https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md

### Adding a feature

- Implements an existing feature request or RFC. Make sure the feature
request has been accepted for implementation before opening a PR. (A
discussion must be opened, see
https://github.com/vercel/next.js/discussions/new?category=ideas)
- Related issues/discussions are linked using `fixes #number`
- e2e tests added
(https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs)
- Documentation added
- Telemetry added. In case of a feature if it's used or not.
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md


## For Maintainers

- Minimal description (aim for explaining to someone not on the team to
understand the PR)
- When linking to a Slack thread, you might want to share details of the
conclusion
- Link both the Linear (Fixes NEXT-xxx) and the GitHub issues
- Add review comments if necessary to explain to the reviewer the logic
behind a change

### What?

### Why?

### How?

Closes NEXT-
Fixes #

-->


Closes NEXT-2995
epiloguess pushed a commit to epiloguess/next.js that referenced this pull request Apr 5, 2024
@ztanner @epiloguess
docs: add experimental staleTimes resource (vercel#64040)
f711e54 
This documents the behavior introduced in vercel#62856 to allow globally
overriding the router cache invalidation period.

`static` and `dynamic` in this case refer to variable levels of
"liveness" and are unrelated to whether the segment itself is opting
into static or dynamic rendering. In other words, the current `dynamic`
default of 30s suggests that we consider the 30s delta to feel dynamic
while still providing some caching for performance reasons. Others might
prefer a value of 0s here, hence the configuration.

<!-- Thanks for opening a PR! Your contribution is much appreciated.
To make sure your PR is handled as smoothly as possible we request that
you follow the checklist sections below.
Choose the right checklist for the change(s) that you're making:

## For Contributors

### Improving Documentation

- Run `pnpm prettier-fix` to fix formatting issues before opening the
PR.
- Read the Docs Contribution Guide to ensure your contribution follows
the docs guidelines:
https://nextjs.org/docs/community/contribution-guide

### Adding or Updating Examples

- The "examples guidelines" are followed from our contributing doc
https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md
- Make sure the linting passes by running `pnpm build && pnpm lint`. See
https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md

### Fixing a bug

- Related issues linked using `fixes #number`
- Tests added. See:
https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md

### Adding a feature

- Implements an existing feature request or RFC. Make sure the feature
request has been accepted for implementation before opening a PR. (A
discussion must be opened, see
https://github.com/vercel/next.js/discussions/new?category=ideas)
- Related issues/discussions are linked using `fixes #number`
- e2e tests added
(https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs)
- Documentation added
- Telemetry added. In case of a feature if it's used or not.
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md


## For Maintainers

- Minimal description (aim for explaining to someone not on the team to
understand the PR)
- When linking to a Slack thread, you might want to share details of the
conclusion
- Link both the Linear (Fixes NEXT-xxx) and the GitHub issues
- Add review comments if necessary to explain to the reviewer the logic
behind a change

### What?

### Why?

### How?

Closes NEXT-
Fixes #

-->


Closes NEXT-2995
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Apr 17, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

@feedthejim feedthejim feedthejim approved these changes

@timneutkens timneutkens Awaiting requested review from timneutkens

@ijjk ijjk Awaiting requested review from ijjk

@shuding shuding Awaiting requested review from shuding

@huozhi huozhi Awaiting requested review from huozhi

@wyattjoh wyattjoh Awaiting requested review from wyattjoh

+1 more reviewer

@AkifumiSato AkifumiSato AkifumiSato left review comments

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

created-by: Next.js team PRs by the Next.js team. locked type: next

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

8 participants

@ztanner @ijjk @jrnxf @Enngage @Cnsbmkpsr @eremenko1 @feedthejim @AkifumiSato