@rangojs/router 0.0.0-experimental.bd6e11bc → 0.0.0-experimental.bdaf10aa

package/src/browser/event-controller.ts

@@ -10,7 +10,10 @@ import type {
   HandleData,
   StreamingToken,
 } from "./types.js";
-import { filterSegmentOrder } from "./react/filter-segment-order.js";
+import {
+  filterSegmentOrder,
+  filterRouteSegmentIds,
+} from "./react/filter-segment-order.js";
 
 // Polyfill Symbol.dispose for Safari and older browsers
 if (typeof Symbol.dispose === "undefined") {
@@ -165,6 +168,22 @@ export interface ActionHandle extends Disposable {
   startStreaming(): StreamingToken;
   /** Record segments that were revalidated */
   recordRevalidatedSegments(segmentIds: string[]): void;
+  /**
+   * Claim the subset of a location-state payload this action may write. A key
+   * is claimed only if no later-initiated action in the SAME cohort has already
+   * claimed it, so same-key concurrent writes resolve to the last-initiated
+   * action while distinct keys from every action survive. Recording the claim
+   * stops a later-settling earlier action from overwriting it. Arbitration is
+   * scoped to the action's cohort (its originating history entry, captured at
+   * startAction), so an action on one entry cannot suppress an action on
+   * another that happens to write the same slot.
+   *
+   * Contract: this guarantees the FINAL value is the last-initiated action's,
+   * not that the loser is never momentarily visible. When an earlier-initiated
+   * action settles first, its value is merged and observable until the
+   * later-initiated winner's response lands and overwrites it.
+   */
+  claimLocationState(state: Record<string, unknown>): Record<string, unknown>;
   /** Complete the action with result */
   complete(result?: unknown): void;
   /** Fail the action with error */
@@ -191,7 +210,12 @@ export interface EventController {
   abortNavigation(): void;
 
   // Action operations
-  startAction(actionId: string, args: unknown[]): ActionHandle;
+  startAction(
+    actionId: string,
+    args: unknown[],
+    /** Originating history entry key; scopes location-state arbitration. */
+    cohort?: string,
+  ): ActionHandle;
   abortAllActions(): void;
 
   // State access
@@ -225,6 +249,14 @@ export interface EventController {
     resolvedIds?: string[],
   ): void;
   getHandleState(): HandleState;
+  /**
+   * Update ONLY `routeSegmentIds` (what `useSegments` reads) from `matched`,
+   * leaving `data` and `segmentOrder` (what `useHandle` collects over) untouched.
+   * Used while a deferred handle is resolving: the route has changed (so
+   * `useSegments` must reflect the new segment ids) but `useHandle` still holds
+   * its previous value until the deferred snapshot is applied.
+   */
+  setRouteSegmentIds(matched: string[]): void;
 
   // Params operations
   setParams(params: Record<string, string>): void;
@@ -237,10 +269,6 @@ export interface EventController {
   hadAnyConcurrentActions(): boolean;
 }
 
-// ============================================================================
-// Default States
-// ============================================================================
-
 const DEFAULT_ACTION_STATE: TrackedActionState = {
   state: "idle",
   actionId: null,
@@ -249,6 +277,13 @@ const DEFAULT_ACTION_STATE: TrackedActionState = {
   result: null,
 };
 
+// Shared empty inflight-actions list. getState() hands back this exact reference
+// whenever no action is inflight (the overwhelmingly common case), so the derived
+// snapshot's `inflightActions` is referentially stable across notifies instead of
+// a fresh [] each call. Read-only by contract (consumers only read length/spread),
+// same as the shared DEFAULT_ACTION_STATE.
+const EMPTY_INFLIGHT_ACTIONS: InflightAction[] = [];
+
 /**
  * Check if a subscription ID matches an action's full ID.
  *
@@ -261,16 +296,12 @@ function matchesActionId(
   entryActionId: string,
 ): boolean {
   if (subscriptionId.includes("#")) {
-    // Full ID: exact match
     return subscriptionId === entryActionId;
   }
-  // Action name only: suffix match (matches "anything#actionName")
   return entryActionId.endsWith(`#${subscriptionId}`);
 }
 
-// Coalesce rapid notifications into one microtask-deferred fan-out; the
-// setTimeout(0) batching prevents render storms. Each notifier owns its timer
-// so listener kinds coalesce independently.
+// Batch rapid notifications into one microtask to prevent render storms
 function makeDebouncedNotifier(listeners: Set<() => void>): () => void {
   let timeout: ReturnType<typeof setTimeout> | null = null;
   return () => {
@@ -282,13 +313,6 @@ function makeDebouncedNotifier(listeners: Set<() => void>): () => void {
   };
 }
 
-// ============================================================================
-// Implementation
-// ============================================================================
-
-/**
- * Configuration for creating an event controller
- */
 export interface EventControllerConfig {
   initialLocation?: NavigationLocation;
 }
@@ -306,51 +330,68 @@ export interface EventControllerConfig {
 export function createEventController(
   config?: EventControllerConfig,
 ): EventController {
-  // ========================================================================
-  // Source of Truth
-  // ========================================================================
-
-  // Current navigation in progress (null = idle)
   let currentNavigation: NavigationEntry | null = null;
 
-  // All in-flight actions (keyed by unique instance ID)
   const inflightActions = new Map<string, ActionEntry>();
 
-  // Committed location (updated when navigation completes)
   let location: NavigationLocation =
     config?.initialLocation ??
     (typeof window !== "undefined"
       ? new URL(window.location.href)
       : new URL("/", "http://localhost"));
 
-  // Track if any concurrent actions occurred (for consolidation)
   let hadAnyConcurrentActions = false;
 
-  // Track segments revalidated by concurrent actions
   const concurrentRevalidatedSegments = new Set<string>();
 
-  // Active streaming count (independent of navigation/action lifecycle)
+  // Monotonic dispatch counter: every startAction() takes the next value
+  // (private), so a larger sequence means the action was initiated later.
+  let actionDispatchSeq = 0;
+
+  // Concurrent location-state arbitration, scoped PER COHORT (history entry).
+  // Each cohort owns a slotKey->winningDispatchSeq map plus a refcount of its
+  // inflight actions; claimLocationState() consults its own cohort's map so
+  // same-key writes within one entry resolve to the last-initiated action
+  // regardless of settle order, while actions on different entries never
+  // compete. A cohort's map is freed once its LAST action's cleanup runs — the
+  // same brief post-settle grace (doSettle's 100ms timer) as other action
+  // teardown, not when every action everywhere settles — so a long-running
+  // action in one cohort can never retain arbitration keys from other cohorts
+  // that have since drained. It is never cleared in clearConsolidation, which
+  // fires
+  // per-action on divert/error and would let a later-settling earlier action
+  // wrongly reclaim a key a sibling already won.
+  const cohortArbitration = new Map<
+    string,
+    { keySeq: Map<string, number>; inflight: number }
+  >();
+
   let activeStreamCount = 0;
 
-  // Handle data from RSC payload
   let handleData: HandleData = {};
   let handleSegmentOrder: string[] = [];
   let routeSegmentIds: string[] = [];
 
-  // Merged route params from current match
   let routeParams: Record<string, string> = {};
 
-  // ========================================================================
-  // Listeners
-  // ========================================================================
-
   const stateListeners = new Set<StateListener>();
   const actionListeners = new Map<string, Set<ActionStateListener>>();
   const handleListeners = new Set<HandleListener>();
 
-  const notify = makeDebouncedNotifier(stateListeners);
+  const notifyStateListeners = makeDebouncedNotifier(stateListeners);
+
+  // Memoized derived snapshot. Every state mutation already funnels through
+  // notify(), so invalidating here (synchronously, before the debounced fire)
+  // means a getState() call between two mutations reuses the same object — an
+  // unchanged state returns the SAME reference — while any real change recomputes
+  // on the next read. Kept null when dirty.
+  let cachedDerivedState: DerivedNavigationState | null = null;
+
+  function notify(): void {
+    cachedDerivedState = null;
+    notifyStateListeners();
+  }
 
-  // Debounce per-action notifications
   const actionNotifyTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
 
   function notifyAction(actionId: string) {
@@ -362,8 +403,6 @@ export function createEventController(
       actionId,
       setTimeout(() => {
         actionNotifyTimeouts.delete(actionId);
-        // Notify all listeners whose subscription ID matches this action
-        // This includes exact matches and suffix matches (e.g., "addToCart" matches "hash#addToCart")
         for (const [subscriptionId, listeners] of actionListeners) {
           if (matchesActionId(subscriptionId, actionId)) {
             const state = getActionState(subscriptionId);
@@ -376,33 +415,32 @@ export function createEventController(
 
   const notifyHandles = makeDebouncedNotifier(handleListeners);
 
-  // ========================================================================
-  // Derived State
-  // ========================================================================
-
   function getState(): DerivedNavigationState {
-    // Build inflight actions list (for compatibility with existing API)
-    const inflightActionsList: InflightAction[] = [...inflightActions.values()]
-      .filter((a) => a.phase !== "settling")
-      .map((a) => ({
-        id: a.id,
-        actionId: a.actionId,
-        payload: a.payload,
-        startedAt: a.startedAt,
-      }));
-
-    // State: loading if navigation OR actions are in progress
-    // Background revalidations (skipLoadingState) don't affect visible state
+    if (cachedDerivedState) return cachedDerivedState;
+
+    // Skip the spread/filter/map entirely when idle — the common case — and hand
+    // back the shared frozen empty list for referential stability.
+    const inflightActionsList: InflightAction[] =
+      inflightActions.size === 0
+        ? EMPTY_INFLIGHT_ACTIONS
+        : [...inflightActions.values()]
+            .filter((a) => a.phase !== "settling")
+            .map((a) => ({
+              id: a.id,
+              actionId: a.actionId,
+              payload: a.payload,
+              startedAt: a.startedAt,
+            }));
+
     const hasActiveActions = inflightActionsList.length > 0;
     const isVisibleNavigation =
       currentNavigation !== null &&
       !currentNavigation.options?.skipLoadingState;
     const state = isVisibleNavigation || hasActiveActions ? "loading" : "idle";
 
-    // Streaming: true if any active streams (navigation or action) or loading
     const isStreaming = activeStreamCount > 0 || state === "loading";
 
-    return {
+    cachedDerivedState = {
       state,
       isStreaming,
       // True when a navigation is active (fetching or streaming, before
@@ -418,11 +456,14 @@ export function createEventController(
           : null,
       inflightActions: inflightActionsList,
     };
+    return cachedDerivedState;
   }
 
   function getActionState(actionId: string): TrackedActionState {
-    // Prefer the most-recent non-settling entry; fall back to most-recent
-    // settling so a just-settled action's result/error stays readable.
+    // Nothing inflight — skip building/scanning the list and return the shared
+    // idle snapshot (the same reference use-action falls back to).
+    if (inflightActions.size === 0) return DEFAULT_ACTION_STATE;
+
     const entry = [...inflightActions.values()]
       .filter((a) => matchesActionId(actionId, a.actionId))
       .reduce<ActionEntry | undefined>((best, a) => {
@@ -437,7 +478,6 @@ export function createEventController(
       return { ...DEFAULT_ACTION_STATE };
     }
 
-    // Derive state from phase
     let state: ActionLifecycleState;
     switch (entry.phase) {
       case "fetching":
@@ -552,10 +592,29 @@ export function createEventController(
   // Action Operations
   // ========================================================================
 
-  function startAction(actionId: string, args: unknown[]): ActionHandle {
+  function startAction(
+    actionId: string,
+    args: unknown[],
+    cohort?: string,
+  ): ActionHandle {
     const id = `${actionId}-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+    // Private to this handle: never exposed on the returned ActionHandle.
+    const dispatchSeq = actionDispatchSeq++;
     const abort = new AbortController();
 
+    // Register this action under its cohort (originating history entry). The
+    // cohort's arbitration is created on first use and freed when its last
+    // action settles (see doSettle). Keyless entries share the "" cohort.
+    const cohortId = cohort ?? "";
+    let arb = cohortArbitration.get(cohortId);
+    if (!arb) {
+      arb = { keySeq: new Map<string, number>(), inflight: 0 };
+      cohortArbitration.set(cohortId, arb);
+    }
+    // const so the captured reference stays non-undefined inside doSettle.
+    const arbitration = arb;
+    arbitration.inflight++;
+
     // Track if this action started while others were pending (concurrent)
     const hadConcurrent = inflightActions.size > 0;
     if (hadConcurrent) {
@@ -579,11 +638,28 @@ export function createEventController(
     let settled = false;
     let streamingEnded = false;
     let actionCompleted = false;
+    let cohortReleased = false;
     let pendingResult:
       | { type: "success"; value?: unknown }
       | { type: "error"; value: unknown }
       | null = null;
 
+    // Release this action's hold on its cohort arbitration exactly once: drop
+    // the refcount and, only if the map still points at THIS arbitration object,
+    // delete it. A newer generation may have replaced it (e.g. abortAllActions
+    // cleared the map and a fresh action recreated the same cohort id), so a
+    // stale settlement must never delete the newer one by id.
+    function releaseCohort() {
+      if (cohortReleased) return;
+      cohortReleased = true;
+      if (
+        --arbitration.inflight <= 0 &&
+        cohortArbitration.get(cohortId) === arbitration
+      ) {
+        cohortArbitration.delete(cohortId);
+      }
+    }
+
     function doSettle() {
       if (settled) return;
       settled = true;
@@ -591,6 +667,9 @@ export function createEventController(
       // Cleanup after brief delay (allow useAction to read result)
       setTimeout(() => {
         inflightActions.delete(id);
+        // Free this cohort's arbitration once its last action has settled, so
+        // a long-running action elsewhere cannot pin keys from a drained entry.
+        releaseCohort();
         // Check for consolidation
         if (inflightActions.size === 0) {
           // All actions done - reset tracking
@@ -667,6 +746,26 @@ export function createEventController(
         segmentIds.forEach((id) => concurrentRevalidatedSegments.add(id));
       },
 
+      claimLocationState(state: Record<string, unknown>) {
+        const winning: Record<string, unknown> = {};
+        // Arbitrate against this action's OWN captured arbitration object, not a
+        // live map lookup: a concurrent map clear/replace (abortAllActions, a
+        // stale settlement) must not make this action silently stop recording
+        // and accept every key.
+        const keySeq = arbitration.keySeq;
+        for (const key of Object.keys(state)) {
+          const prevSeq = keySeq.get(key);
+          // Strictly-greater: a later-initiated action wins a key over an
+          // earlier one in the same cohort regardless of arrival order. Equal
+          // cannot happen (dispatchSeq is unique per action).
+          if (prevSeq === undefined || dispatchSeq > prevSeq) {
+            keySeq.set(key, dispatchSeq);
+            winning[key] = state[key];
+          }
+        }
+        return winning;
+      },
+
       complete(result?: unknown) {
         settleWith({ type: "success", value: result });
       },
@@ -688,6 +787,10 @@ export function createEventController(
       [Symbol.dispose]() {
         // If aborted, another navigation/error took over - don't touch state
         if (abort.signal.aborted) {
+          // Aborted actions skip doSettle, so release the cohort hold here to
+          // keep the per-cohort refcount balanced (no leak when an action is
+          // aborted individually rather than via abortAllActions).
+          releaseCohort();
           inflightActions.delete(id);
           notify();
           notifyAction(actionId);
@@ -722,6 +825,7 @@ export function createEventController(
     }
     hadAnyConcurrentActions = false;
     concurrentRevalidatedSegments.clear();
+    cohortArbitration.clear();
     notify();
     // Notify all action listeners directly by subscription ID.
     // actionListeners keys are subscription IDs (possibly short names like
@@ -748,9 +852,7 @@ export function createEventController(
     const newSegmentOrder = filterSegmentOrder(rawMatched);
     // Separate list for useSegments(): "layouts and routes only" — strip
     // parallels (".@") and loader sub-ids (D digit) without reordering.
-    const newRouteSegmentIds = rawMatched.filter(
-      (id) => !id.includes(".@") && !/D\d+\./.test(id),
-    );
+    const newRouteSegmentIds = filterRouteSegmentIds(rawMatched);
 
     if (isPartial && newSegmentOrder.length > 0) {
       // Partial update: merge new data with existing
@@ -797,6 +899,18 @@ export function createEventController(
     };
   }
 
+  function setRouteSegmentIds(matched: string[]): void {
+    const next = filterRouteSegmentIds(matched);
+    if (
+      next.length === routeSegmentIds.length &&
+      next.every((id, i) => id === routeSegmentIds[i])
+    ) {
+      return;
+    }
+    routeSegmentIds = next;
+    notifyHandles();
+  }
+
   // ========================================================================
   // Subscriptions
   // ========================================================================
@@ -865,6 +979,7 @@ export function createEventController(
     // Handles
     setHandleData,
     getHandleState,
+    setRouteSegmentIds,
 
     // Params
     setParams,
@@ -881,40 +996,3 @@ export function createEventController(
     hadAnyConcurrentActions: () => hadAnyConcurrentActions,
   };
 }
-
-// ============================================================================
-// Singleton
-// ============================================================================
-
-let controllerInstance: EventController | null = null;
-
-/**
- * Initialize the global event controller
- */
-export function initEventController(
-  config?: EventControllerConfig,
-): EventController {
-  if (!controllerInstance) {
-    controllerInstance = createEventController(config);
-  }
-  return controllerInstance;
-}
-
-/**
- * Get the global event controller
- */
-export function getEventController(): EventController {
-  if (!controllerInstance) {
-    throw new Error(
-      "Event controller not initialized. Call initEventController first.",
-    );
-  }
-  return controllerInstance;
-}
-
-/**
- * Reset the controller instance (for testing)
- */
-export function resetEventController(): void {
-  controllerInstance = null;
-}

package/src/browser/invalidate-client-cache.ts

@@ -0,0 +1,52 @@
+/**
+ * Client seat of `invalidateClientCache()` (the `default` export condition).
+ *
+ * Makes the current client behave as if a server action had just completed:
+ * the history cache is marked stale (SWR), the prefetch map is flushed, the
+ * state rotates, and sibling tabs are broadcast to — the same
+ * `markCacheAsStaleAndBroadcast()` path the server-action bridge uses. This is
+ * the gentler mark-stale (not hard-clear) behavior, so Back renders the cached
+ * entry instantly and revalidates.
+ */
+
+import { getRegisteredStore } from "./navigation-store-handle.js";
+import { clearPrefetchCache } from "./prefetch/cache.js";
+
+export function invalidateClientCache(): void {
+  if (typeof document === "undefined") {
+    // SSR pass of a client component also resolves the default condition. A
+    // render-time call must not take down the page; no-op with a dev warning.
+    if (process.env.NODE_ENV !== "production") {
+      console.warn(
+        "[rango] invalidateClientCache() was called during a server render; " +
+          "it is a no-op outside the browser.",
+      );
+    }
+    return;
+  }
+
+  const store = getRegisteredStore();
+  if (store) {
+    store.markCacheAsStaleAndBroadcast();
+    return;
+  }
+
+  // Pre-boot: no store registered yet. clearPrefetchCache() (which rotates the
+  // state) is complete at this point — there is no history cache to mark and no
+  // sibling state worth broadcasting.
+  clearPrefetchCache();
+}
+
+/**
+ * Client no-op for `keepClientCache()`. It is a server action directive (the
+ * `react-server` condition sets a response header the action bridge reads);
+ * there is nothing to suppress from the client side.
+ */
+export function keepClientCache(): void {
+  if (process.env.NODE_ENV !== "production") {
+    console.warn(
+      "[rango] keepClientCache() has no effect on the client; it is a server " +
+        "action directive. Call it from inside a server action.",
+    );
+  }
+}

package/src/browser/logging.ts

@@ -1,5 +1,15 @@
 import { INTERNAL_RANGO_DEBUG } from "../internal-debug.js";
 
+/**
+ * Module-level debug flag for guarding call sites whose debug arguments do
+ * non-trivial work (joins, maps, spreads, object literals). Because the Vite
+ * transform folds INTERNAL_RANGO_DEBUG to a literal, an `if (IS_BROWSER_DEBUG)`
+ * guard is minifier-DCE-able — the whole block drops from the production bundle.
+ * Prefer this over isBrowserDebugEnabled() at hot call sites: a const guard folds
+ * where a function call may not.
+ */
+export const IS_BROWSER_DEBUG: boolean = INTERNAL_RANGO_DEBUG;
+
 interface BrowserLogContext {
   requestId: string;
   txId: string;
@@ -53,3 +63,21 @@ export function debugLog(msg: string, ...args: unknown[]): void {
     console.log(msg, ...args);
   }
 }
+
+/**
+ * Boot-sequence debug log: one line per initial-document step (flight decode,
+ * handle stream, bridge wiring, initial tree build, hydration commit), each
+ * stamped with performance.now() so the gap BEFORE hydrateRoot is visible.
+ * The initial document path was otherwise silent — FE debug only started
+ * talking at the first soft navigation, so a boot stall (e.g. an await that
+ * holds initBrowserApp, and with it hydrateRoot) was invisible.
+ */
+export function bootLog(step: string, details?: Record<string, unknown>): void {
+  if (!INTERNAL_RANGO_DEBUG) return;
+  const prefix = `[Browser][boot] ${step} @ ${Math.round(performance.now())}ms`;
+  if (details) {
+    console.log(prefix, details);
+    return;
+  }
+  console.log(prefix);
+}

package/src/browser/merge-segment-loaders.ts

@@ -1,5 +1,5 @@
 import type { ResolvedSegment } from "./types.js";
-import { debugLog } from "./logging.js";
+import { debugLog, IS_BROWSER_DEBUG } from "./logging.js";
 
 /**
  * Merge partial loader data from server with cached loader data.
@@ -19,9 +19,11 @@ export function mergeSegmentLoaders(
   const serverLoaderIds = fromServer.loaderIds || [];
   const cachedLoaderIds = fromCache.loaderIds || [];
 
-  debugLog(
-    `[Browser] Merging partial loaders: server has ${serverLoaderIds.join(", ")}, cache has ${cachedLoaderIds.join(", ")}`,
-  );
+  if (IS_BROWSER_DEBUG) {
+    debugLog(
+      `[Browser] Merging partial loaders: server has ${serverLoaderIds.join(", ")}, cache has ${cachedLoaderIds.join(", ")}`,
+    );
+  }
 
   return {
     ...fromCache,