react-router
react-router copied to clipboard
Updating search params using `useSearchParams` seems to trigger more than one render
Reproduction
https://stackblitz.com/edit/remix-run-remix-nri7k8?file=app%2Froutes%2F_index.tsx
Click set param button and you'll see that the history stack will have 5 items (4 re-renders because of changing searchParams) instead of 2 and the first 2 re-renders will get the unchanged value of the search param
System Info
System:
OS: macOS 14.4.1
CPU: (10) arm64 Apple M1 Pro
Memory: 75.69 MB / 32.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.13.1 - /usr/local/bin/node
Yarn: 1.22.19 - ~/.yarn/bin/yarn
npm: 10.5.2 - /usr/local/bin/npm
pnpm: 9.1.3 - /usr/local/bin/pnpm
bun: 1.1.10 - ~/#####REDACTED#####/node_modules/.bin/bun
Watchman: 2024.04.15.00 - /opt/homebrew/bin/watchman
Browsers:
Chrome: 125.0.6422.113
Safari: 17.4.1
Used Package Manager
npm
Expected Behavior
updating search params using useSearchParams should trigger only one re-render
Actual Behavior
updating search params using useSearchParams is causing 4 (3 extra) re-renders. and the first 2 re-renders gets the unchanged value of the search param