Summary

Replaces the flushSync call in BaseRouter's baseNavigate with a deferred promise pattern.

Problem

The current implementation uses flushSync to guarantee the re-render happens before returning control to the caller. While this works, flushSync has performance implications:

• Forces React to synchronously flush the entire update queue
• Bypasses React's batching and scheduling optimizations
• Can cause layout thrashing in complex UIs

Solution

Use a deferred promise pattern instead:

1. Store the resolve function in state alongside the new route parts
2. An effect resolves the promise after React commits the state update
3. This achieves the same guarantee without forcing synchronous updates

// Before (flushSync)
flushSync(() => {
 setRouteParts({ path: toURL.pathname, queryString: toURL.search });
});
return internalNavRes;
// After (deferred promise)
return new Promise(resolve => {
 setRouteParts({ path: toURL.pathname, queryString: toURL.search });
 setPendingNavigation({
 routeParts: { path: toURL.pathname, queryString: toURL.search },
 result: internalNavRes,
 resolve,
 });
});

Benefits

• Avoids flushSync performance penalty
• Works better with React concurrent features
• Maintains the same behavioral guarantee (re-render completes before promise resolves)