Avoid unnecessary router subscribes (#10409)

Co-authored-by: Alexander Nanberg <[email protected]>

Author: brophdawg11

.changeset/silent-stingrays-boil.md

@@ -0,0 +1,5 @@
+---
+"react-router": patch
+---
+
+Avoid uneccesary unsubscribe/resubscribes on router state changes

contributors.yml

@@ -9,6 +9,7 @@
 - akamfoad
 - alany411
 - alberto
+- alexandernanberg
 - alexlbr
 - AmRo045
 - amsal

packages/react-router/lib/components.tsx

@@ -57,17 +57,10 @@ export function RouterProvider({
   fallbackElement,
   router,
 }: RouterProviderProps): React.ReactElement {
-  let [state, setState] = React.useState(router.state);
-
   // Need to use a layout effect here so we are subscribed early enough to
   // pick up on any render-driven redirects/navigations (useEffect/<Navigate>)
-  React.useLayoutEffect(() => {
-    return router.subscribe((newState) => {
-      if (newState !== state) {
-        setState(newState);
-      }
-    });
-  }, [router, state]);
+  let [state, setState] = React.useState(router.state);
+  React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
 
   let navigator = React.useMemo((): Navigator => {
     return {