Repository navigation
useLoaderData causes component to render twice after loader run #4054
Description
Which project does this relate to?
Router
Describe the bug
I'm writing a page that shows the list of posts with the filters that are taken from the search parameters. On every search parameters change the route should reload with a new (filtered) list of posts, but instead it reloads twice.
Your Example Website or App
https://stackblitz.com/edit/tanstack-router-pcurpwgc?file=src%2Fmain.tsx
Steps to Reproduce the Bug or Issue
- Go to the '/posts' page
- Click "update" button to update the page search parameters
- Observe in the console that child component, that has useLoaderData, renders twice, despite the loader running once.
Expected behavior
I expected component using useLoaderData to be rendered once, but instead it's rendered twice.
Screenshots or Videos
Screen.Recording.2025-04-25.at.19.46.43.mov
Platform
- OS: macOS
- Browser: Chrome
- Version: 135.0.7049.96
Additional context
If the loader is synchronous (without Promise, just immediate return), the Child component is rendered once as expected.
Activity
LadyBluenotes commentedon Jul 13, 2026
This no longer reproduces on current main. I tested the same setup with an async loader keyed by search-derived
loaderDeps: changing the search parameter ran the loader once and rendered theuseLoaderDataconsumer once.The current per-match reactivity was introduced as part of #6704, which prevents loader-data consumers from being updated by unrelated Router state changes.
I’m going to close this as fixed. If you still see the extra render on the latest Router version, please open a new issue with an updated reproduction and we can compare the exact render sequence.