Skip to content

Layouts are not caching data after initial staleTime #2980

@jakst

Description

@jakst

Which project does this relate to?

Router

Describe the bug

In the basic-file-based example, which has defaultStaleTime: 5000, there is a posts page that links to individual posts. When hovering a post link it should preload that post, but not reload the data for the parent layout (the posts page) until it's data is stale.

However, when putting the example under a bit of pressure by hovering all the post links many times quickly, after the initial stale time of 5s TSR starts reloading data for the current layout on every single hover. It's never cached again. See this video where the Fetching posts... message starts being logged for every hover after the initial 5s stale time. If this was working as intended there should never be a Fetching posts... message being logged with less than 5s in between.

Screen.Recording.2024-12-11.at.10.57.25.mov

Your Example Website or App

https://stackblitz.com/github/tanstack/router/tree/main/examples/react/basic-file-based?embed=1&theme=dark&preset=node&file=src/main.tsx

Steps to Reproduce the Bug or Issue

  1. Go to the stackblitz
  2. Open the posts page
  3. Wait 5 seconds
  4. Hover the different post links like crazy
  5. Observe the Fetching posts... messages in the console

Expected behavior

I expect the layout to have its data cached when navigating between different pages within it.

Platform

  • OS: MacOS
  • Browser: Chrome

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions