@rangojs/router 0.0.0-experimental.83 → 0.0.0-experimental.8332dbe4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (100) hide show
  1. package/README.md +112 -17
  2. package/dist/vite/index.js +1197 -454
  3. package/package.json +4 -2
  4. package/skills/breadcrumbs/SKILL.md +3 -1
  5. package/skills/handler-use/SKILL.md +2 -0
  6. package/skills/hooks/SKILL.md +30 -2
  7. package/skills/i18n/SKILL.md +276 -0
  8. package/skills/intercept/SKILL.md +25 -0
  9. package/skills/layout/SKILL.md +2 -0
  10. package/skills/links/SKILL.md +234 -16
  11. package/skills/loader/SKILL.md +70 -3
  12. package/skills/middleware/SKILL.md +2 -0
  13. package/skills/migrate-nextjs/SKILL.md +3 -1
  14. package/skills/migrate-react-router/SKILL.md +4 -0
  15. package/skills/parallel/SKILL.md +9 -0
  16. package/skills/rango/SKILL.md +2 -0
  17. package/skills/response-routes/SKILL.md +8 -0
  18. package/skills/route/SKILL.md +24 -0
  19. package/skills/server-actions/SKILL.md +739 -0
  20. package/skills/streams-and-websockets/SKILL.md +283 -0
  21. package/skills/typesafety/SKILL.md +9 -1
  22. package/skills/view-transitions/SKILL.md +212 -0
  23. package/src/browser/app-shell.ts +52 -0
  24. package/src/browser/event-controller.ts +44 -4
  25. package/src/browser/navigation-bridge.ts +113 -6
  26. package/src/browser/navigation-store.ts +25 -1
  27. package/src/browser/partial-update.ts +44 -10
  28. package/src/browser/prefetch/cache.ts +16 -0
  29. package/src/browser/rango-state.ts +53 -13
  30. package/src/browser/react/NavigationProvider.tsx +64 -16
  31. package/src/browser/react/filter-segment-order.ts +51 -7
  32. package/src/browser/react/index.ts +3 -0
  33. package/src/browser/react/use-params.ts +8 -5
  34. package/src/browser/react/use-reverse.ts +99 -0
  35. package/src/browser/react/use-router.ts +8 -1
  36. package/src/browser/react/use-segments.ts +11 -8
  37. package/src/browser/rsc-router.tsx +34 -6
  38. package/src/browser/types.ts +19 -0
  39. package/src/build/route-trie.ts +2 -1
  40. package/src/cache/cf/cf-cache-store.ts +5 -7
  41. package/src/client.rsc.tsx +3 -0
  42. package/src/client.tsx +5 -1
  43. package/src/href-client.ts +4 -1
  44. package/src/index.rsc.ts +3 -0
  45. package/src/index.ts +3 -0
  46. package/src/outlet-context.ts +1 -1
  47. package/src/response-utils.ts +28 -0
  48. package/src/reverse.ts +62 -39
  49. package/src/route-definition/dsl-helpers.ts +16 -3
  50. package/src/route-definition/helpers-types.ts +6 -1
  51. package/src/route-definition/resolve-handler-use.ts +6 -0
  52. package/src/router/handler-context.ts +21 -41
  53. package/src/router/lazy-includes.ts +1 -1
  54. package/src/router/loader-resolution.ts +3 -0
  55. package/src/router/match-api.ts +4 -3
  56. package/src/router/match-handlers.ts +1 -0
  57. package/src/router/match-result.ts +21 -2
  58. package/src/router/middleware-types.ts +14 -25
  59. package/src/router/middleware.ts +54 -7
  60. package/src/router/pattern-matching.ts +101 -17
  61. package/src/router/revalidation.ts +15 -1
  62. package/src/router/segment-resolution/fresh.ts +8 -0
  63. package/src/router/segment-resolution/revalidation.ts +128 -100
  64. package/src/router/substitute-pattern-params.ts +56 -0
  65. package/src/router/trie-matching.ts +18 -13
  66. package/src/router/url-params.ts +49 -0
  67. package/src/router.ts +1 -2
  68. package/src/rsc/handler.ts +8 -4
  69. package/src/rsc/progressive-enhancement.ts +2 -0
  70. package/src/rsc/response-route-handler.ts +11 -10
  71. package/src/rsc/rsc-rendering.ts +3 -0
  72. package/src/rsc/server-action.ts +2 -0
  73. package/src/rsc/types.ts +6 -0
  74. package/src/segment-system.tsx +60 -9
  75. package/src/server/request-context.ts +10 -42
  76. package/src/ssr/index.tsx +5 -1
  77. package/src/types/handler-context.ts +12 -39
  78. package/src/types/loader-types.ts +5 -6
  79. package/src/types/request-scope.ts +126 -0
  80. package/src/types/segments.ts +17 -0
  81. package/src/urls/response-types.ts +2 -10
  82. package/src/vite/debug.ts +184 -0
  83. package/src/vite/discovery/discover-routers.ts +31 -3
  84. package/src/vite/discovery/gate-state.ts +171 -0
  85. package/src/vite/discovery/prerender-collection.ts +48 -1
  86. package/src/vite/discovery/self-gen-tracking.ts +27 -1
  87. package/src/vite/plugins/cjs-to-esm.ts +5 -0
  88. package/src/vite/plugins/client-ref-dedup.ts +16 -0
  89. package/src/vite/plugins/client-ref-hashing.ts +16 -4
  90. package/src/vite/plugins/expose-action-id.ts +52 -28
  91. package/src/vite/plugins/expose-ids/router-transform.ts +20 -3
  92. package/src/vite/plugins/expose-internal-ids.ts +516 -486
  93. package/src/vite/plugins/performance-tracks.ts +17 -9
  94. package/src/vite/plugins/use-cache-transform.ts +56 -43
  95. package/src/vite/plugins/version-injector.ts +37 -11
  96. package/src/vite/rango.ts +49 -14
  97. package/src/vite/router-discovery.ts +498 -52
  98. package/src/vite/utils/banner.ts +1 -1
  99. package/src/vite/utils/package-resolution.ts +41 -1
  100. package/src/vite/utils/prerender-utils.ts +5 -4
@@ -16,6 +16,9 @@ import {
16
16
  stageBuildAssetModule,
17
17
  } from "../utils/prerender-utils.js";
18
18
  import type { DiscoveryState } from "./state.js";
19
+ import { createRangoDebugger, NS } from "../debug.js";
20
+
21
+ const debug = createRangoDebugger(NS.prerender);
19
22
 
20
23
  /**
21
24
  * Expand prerender routes into concrete URLs and render them via the
@@ -30,6 +33,12 @@ export async function expandPrerenderRoutes(
30
33
  ): Promise<void> {
31
34
  if (!state.opts?.enableBuildPrerender || !state.isBuildMode) return;
32
35
 
36
+ const overallStart = debug ? performance.now() : 0;
37
+ debug?.(
38
+ "expandPrerenderRoutes: start (%d router manifest(s))",
39
+ allManifests.length,
40
+ );
41
+
33
42
  type PrerenderEntry = {
34
43
  urlPath: string;
35
44
  routeName: string;
@@ -99,6 +108,7 @@ export async function expandPrerenderRoutes(
99
108
  } else {
100
109
  // Dynamic route: call getParams() to enumerate param combinations
101
110
  if (def?.getParams) {
111
+ const getParamsStart = debug ? performance.now() : 0;
102
112
  try {
103
113
  const buildVars: Record<string, any> = {};
104
114
  const buildEnv = state.resolvedBuildEnv;
@@ -118,6 +128,12 @@ export async function expandPrerenderRoutes(
118
128
  },
119
129
  };
120
130
  const paramsList = await def.getParams(getParamsCtx);
131
+ debug?.(
132
+ "getParams %s -> %d params (%sms)",
133
+ routeName,
134
+ paramsList.length,
135
+ (performance.now() - getParamsStart).toFixed(1),
136
+ );
121
137
  const concurrency = def.options?.concurrency ?? 1;
122
138
  const hasBuildVars =
123
139
  Object.keys(buildVars).length > 0 ||
@@ -191,7 +207,13 @@ export async function expandPrerenderRoutes(
191
207
  }
192
208
  }
193
209
 
194
- if (entries.length === 0) return;
210
+ if (entries.length === 0) {
211
+ debug?.(
212
+ "no prerender entries (done in %sms)",
213
+ (performance.now() - overallStart).toFixed(1),
214
+ );
215
+ return;
216
+ }
195
217
 
196
218
  // Determine the max concurrency for the log header
197
219
  const maxConcurrency = Math.max(...entries.map((e) => e.concurrency));
@@ -200,6 +222,11 @@ export async function expandPrerenderRoutes(
200
222
  console.log(
201
223
  `[rsc-router] Pre-rendering ${entries.length} URL(s)${concurrencyNote}...`,
202
224
  );
225
+ debug?.(
226
+ "prerender loop: %d entries, max concurrency %d",
227
+ entries.length,
228
+ maxConcurrency,
229
+ );
203
230
 
204
231
  const { hashParams } = await rscEnv.runner.import("@rangojs/router/build");
205
232
 
@@ -317,6 +344,13 @@ export async function expandPrerenderRoutes(
317
344
  console.log(
318
345
  `[rsc-router] Pre-render complete: ${parts.join(", ")} (${totalElapsed}ms total)`,
319
346
  );
347
+ debug?.(
348
+ "expandPrerenderRoutes done: %d done, %d skipped, %sms (overall %sms)",
349
+ doneCount,
350
+ skipCount,
351
+ totalElapsed,
352
+ (performance.now() - overallStart).toFixed(1),
353
+ );
320
354
  }
321
355
 
322
356
  /**
@@ -337,6 +371,12 @@ export async function renderStaticHandlers(
337
371
  )
338
372
  return;
339
373
 
374
+ const overallStart = debug ? performance.now() : 0;
375
+ debug?.(
376
+ "renderStaticHandlers: start (%d static module(s))",
377
+ state.resolvedStaticModules.size,
378
+ );
379
+
340
380
  const manifestEntries: Record<string, string> = {};
341
381
  let staticDone = 0;
342
382
  let staticSkip = 0;
@@ -436,4 +476,11 @@ export async function renderStaticHandlers(
436
476
  console.log(
437
477
  `[rsc-router] Static render complete: ${staticParts.join(", ")} (${totalStaticElapsed}ms total)`,
438
478
  );
479
+ debug?.(
480
+ "renderStaticHandlers done: %d done, %d skipped, %sms (overall %sms)",
481
+ staticDone,
482
+ staticSkip,
483
+ totalStaticElapsed,
484
+ (performance.now() - overallStart).toFixed(1),
485
+ );
439
486
  }
@@ -22,6 +22,32 @@ export function markSelfGenWrite(
22
22
  export function consumeSelfGenWrite(
23
23
  state: DiscoveryState,
24
24
  filePath: string,
25
+ ): boolean {
26
+ return checkSelfGenWrite(state, filePath, true);
27
+ }
28
+
29
+ /**
30
+ * Non-consuming variant. Used by the `handleHotUpdate` plugin hook to
31
+ * suppress vite's HMR cascade for our own gen-file writes WITHOUT
32
+ * consuming the entry — `consumeSelfGenWrite` (called later from the
33
+ * chokidar `change` handler in `handleRouteFileChange`) still needs to
34
+ * see and consume the same entry to short-circuit our regen path.
35
+ *
36
+ * Both hooks fire for the same file change event:
37
+ * - `handleHotUpdate` runs first (vite's HMR pipeline).
38
+ * - chokidar `change` callback runs after (filesystem watcher).
39
+ */
40
+ export function peekSelfGenWrite(
41
+ state: DiscoveryState,
42
+ filePath: string,
43
+ ): boolean {
44
+ return checkSelfGenWrite(state, filePath, false);
45
+ }
46
+
47
+ function checkSelfGenWrite(
48
+ state: DiscoveryState,
49
+ filePath: string,
50
+ consume: boolean,
25
51
  ): boolean {
26
52
  const info = state.selfWrittenGenFiles.get(filePath);
27
53
  if (!info) return false;
@@ -33,7 +59,7 @@ export function consumeSelfGenWrite(
33
59
  const current = readFileSync(filePath, "utf-8");
34
60
  const currentHash = createHash("sha256").update(current).digest("hex");
35
61
  if (currentHash === info.hash) {
36
- state.selfWrittenGenFiles.delete(filePath);
62
+ if (consume) state.selfWrittenGenFiles.delete(filePath);
37
63
  return true;
38
64
  }
39
65
  // Hash mismatch: file was changed externally. Keep the entry so a
@@ -1,4 +1,7 @@
1
1
  import type { Plugin } from "vite";
2
+ import { createRangoDebugger, NS } from "../debug.js";
3
+
4
+ const debug = createRangoDebugger(NS.transform);
2
5
 
3
6
  /**
4
7
  * Transform CJS vendor files from @vitejs/plugin-rsc to ESM for browser compatibility.
@@ -21,6 +24,7 @@ export function createCjsToEsmPlugin(): Plugin {
21
24
  ? "./cjs/react-server-dom-webpack-client.browser.production.js"
22
25
  : "./cjs/react-server-dom-webpack-client.browser.development.js";
23
26
 
27
+ debug?.("cjs-to-esm entry redirect %s", id);
24
28
  return {
25
29
  code: `export * from "${cjsFile}";`,
26
30
  map: null,
@@ -81,6 +85,7 @@ export function createCjsToEsmPlugin(): Plugin {
81
85
  // Reconstruct with license at the top
82
86
  transformed = license + "\n" + transformed;
83
87
 
88
+ debug?.("cjs-to-esm body rewrite %s", id);
84
89
  return {
85
90
  code: transformed,
86
91
  map: null,
@@ -1,4 +1,7 @@
1
1
  import type { Plugin, ResolvedConfig } from "vite";
2
+ import { createRangoDebugger, NS } from "../debug.js";
3
+
4
+ const debug = createRangoDebugger(NS.transform);
2
5
 
3
6
  const CLIENT_IN_SERVER_PROXY_PREFIX =
4
7
  "virtual:vite-rsc/client-in-server-package-proxy/";
@@ -62,6 +65,7 @@ export function extractPackageName(absolutePath: string): string | null {
62
65
  */
63
66
  export function clientRefDedup(): Plugin {
64
67
  let clientExclude: string[] = [];
68
+ const dedupedPackages = new Set<string>();
65
69
 
66
70
  return {
67
71
  name: "@rangojs/router:client-ref-dedup",
@@ -76,6 +80,16 @@ export function clientRefDedup(): Plugin {
76
80
  clientEnv?.optimizeDeps?.exclude ?? config.optimizeDeps?.exclude ?? [];
77
81
  },
78
82
 
83
+ buildEnd() {
84
+ if (debug && dedupedPackages.size > 0) {
85
+ debug(
86
+ "client-ref-dedup: redirected %d package(s) (%s)",
87
+ dedupedPackages.size,
88
+ [...dedupedPackages].join(","),
89
+ );
90
+ }
91
+ },
92
+
79
93
  resolveId(source, importer, options) {
80
94
  // Only intercept in the client environment
81
95
  if (this.environment?.name !== "client") return;
@@ -95,6 +109,8 @@ export function clientRefDedup(): Plugin {
95
109
  // Don't redirect packages that are excluded from optimization
96
110
  if (clientExclude.includes(packageName)) return;
97
111
 
112
+ if (debug) dedupedPackages.add(packageName);
113
+
98
114
  // Return a virtual module that re-exports via bare specifier
99
115
  return `\0rango:dedup/${packageName}`;
100
116
  },
@@ -1,6 +1,9 @@
1
1
  import type { Plugin } from "vite";
2
2
  import { relative } from "node:path";
3
3
  import { createHash } from "node:crypto";
4
+ import { createRangoDebugger, createCounter, NS } from "../debug.js";
5
+
6
+ const debug = createRangoDebugger(NS.transform);
4
7
 
5
8
  // Dev-mode client-reference key prefixes emitted by @vitejs/plugin-rsc
6
9
  const CLIENT_PKG_PROXY_PREFIX =
@@ -89,6 +92,7 @@ export function transformClientRefs(
89
92
  * regex replacement of Flight payloads.
90
93
  */
91
94
  export function hashClientRefs(projectRoot: string): Plugin {
95
+ const counter = createCounter(debug, "hash-client-refs");
92
96
  return {
93
97
  name: "@rangojs/router:hash-client-refs",
94
98
  // Run after the RSC plugin's transform (default enforce is normal)
@@ -96,10 +100,18 @@ export function hashClientRefs(projectRoot: string): Plugin {
96
100
  applyToEnvironment(env) {
97
101
  return env.name === "rsc";
98
102
  },
99
- transform(code, _id) {
100
- const result = transformClientRefs(code, projectRoot);
101
- if (result === null) return;
102
- return { code: result, map: null };
103
+ buildEnd() {
104
+ counter?.flush();
105
+ },
106
+ transform(code, id) {
107
+ const start = counter ? performance.now() : 0;
108
+ try {
109
+ const result = transformClientRefs(code, projectRoot);
110
+ if (result === null) return;
111
+ return { code: result, map: null };
112
+ } finally {
113
+ counter?.record(id, performance.now() - start);
114
+ }
103
115
  },
104
116
  };
105
117
  }
@@ -3,6 +3,9 @@ import MagicString from "magic-string";
3
3
  import path from "node:path";
4
4
  import fs from "node:fs";
5
5
  import { normalizePath } from "./expose-id-utils.js";
6
+ import { createRangoDebugger, createCounter, NS } from "../debug.js";
7
+
8
+ const debug = createRangoDebugger(NS.transform);
6
9
 
7
10
  /**
8
11
  * Type for the RSC plugin's manager API
@@ -254,6 +257,8 @@ export function exposeActionId(): Plugin {
254
257
  let isBuild = false;
255
258
  let hashToFileMap: Map<string, string> | undefined;
256
259
  let rscPluginApi: RscPluginApi | undefined;
260
+ const counterTransform = createCounter(debug, "expose-action-id transform");
261
+ const counterRender = createCounter(debug, "expose-action-id renderChunk");
257
262
 
258
263
  return {
259
264
  name: "@rangojs/router:expose-action-id",
@@ -268,6 +273,11 @@ export function exposeActionId(): Plugin {
268
273
  rscPluginApi = getRscPluginApi(config);
269
274
  },
270
275
 
276
+ buildEnd() {
277
+ counterTransform?.flush();
278
+ counterRender?.flush();
279
+ },
280
+
271
281
  buildStart() {
272
282
  // Verify RSC plugin is present at build start (after all config hooks have run)
273
283
  // This allows rsc-router:rsc-integration to dynamically add the RSC plugin
@@ -324,40 +334,54 @@ export function exposeActionId(): Plugin {
324
334
  return;
325
335
  }
326
336
 
327
- // Dev mode: no hash-to-file mapping needed (IDs are already file paths)
328
- return transformServerReferences(code, id);
337
+ const start = counterTransform ? performance.now() : 0;
338
+ try {
339
+ // Dev mode: no hash-to-file mapping needed (IDs are already file paths)
340
+ return transformServerReferences(code, id);
341
+ } finally {
342
+ counterTransform?.record(id, performance.now() - start);
343
+ }
329
344
  },
330
345
 
331
346
  // Build mode: renderChunk runs after all transforms and bundling complete
332
347
  renderChunk(code, chunk) {
333
- // Only RSC bundle should get file paths for revalidation matching
334
- // SSR bundle must NOT use file paths because client components run there
335
- // and need to match the client bundle during hydration (otherwise: error #418)
336
- const isRscEnv = this.environment?.name === "rsc";
337
-
338
- // Only use file path mapping for RSC environment
339
- const effectiveMap = isRscEnv ? hashToFileMap : undefined;
340
-
341
- // For RSC bundles, both createServerReference and registerServerReference
342
- // may need transforming. Use a single MagicString for correct sourcemaps.
343
- if (isRscEnv && hashToFileMap) {
344
- const s = new MagicString(code);
345
- const changed1 = applyServerReferenceWrapping(code, s, effectiveMap);
346
- const changed2 = applyRegisterReferenceWrapping(code, s, hashToFileMap);
347
- if (changed1 || changed2) {
348
- return {
349
- code: s.toString(),
350
- map: s.generateMap({
351
- source: chunk.fileName,
352
- includeContent: true,
353
- }),
354
- };
348
+ const start = counterRender ? performance.now() : 0;
349
+ try {
350
+ // Only RSC bundle should get file paths for revalidation matching
351
+ // SSR bundle must NOT use file paths because client components run there
352
+ // and need to match the client bundle during hydration (otherwise: error #418)
353
+ const isRscEnv = this.environment?.name === "rsc";
354
+
355
+ // Only use file path mapping for RSC environment
356
+ const effectiveMap = isRscEnv ? hashToFileMap : undefined;
357
+
358
+ // For RSC bundles, both createServerReference and registerServerReference
359
+ // may need transforming. Use a single MagicString for correct sourcemaps.
360
+ if (isRscEnv && hashToFileMap) {
361
+ const s = new MagicString(code);
362
+ const changed1 = applyServerReferenceWrapping(code, s, effectiveMap);
363
+ const changed2 = applyRegisterReferenceWrapping(
364
+ code,
365
+ s,
366
+ hashToFileMap,
367
+ );
368
+ if (changed1 || changed2) {
369
+ return {
370
+ code: s.toString(),
371
+ map: s.generateMap({
372
+ source: chunk.fileName,
373
+ includeContent: true,
374
+ }),
375
+ };
376
+ }
377
+ return null;
355
378
  }
356
- return null;
357
- }
358
379
 
359
- // Non-RSC environments: only transform createServerReference calls
360
- return transformServerReferences(code, chunk.fileName, effectiveMap);
380
+ // Non-RSC environments: only transform createServerReference calls
381
+ return transformServerReferences(code, chunk.fileName, effectiveMap);
382
+ } finally {
383
+ counterRender?.record(chunk.fileName, performance.now() - start);
384
+ }
361
385
  },
362
386
  };
363
387
  }
@@ -4,6 +4,9 @@ import path from "node:path";
4
4
  import { createHash } from "node:crypto";
5
5
  import { normalizePath, findMatchingParen } from "../expose-id-utils.js";
6
6
  import { getImportedFnNames } from "./export-analysis.js";
7
+ import { createRangoDebugger, createCounter, NS } from "../../debug.js";
8
+
9
+ const debug = createRangoDebugger(NS.transform);
7
10
 
8
11
  export function transformRouter(
9
12
  code: string,
@@ -82,11 +85,15 @@ export function transformRouter(
82
85
  */
83
86
  export function exposeRouterId(): Plugin {
84
87
  let projectRoot = "";
88
+ const counter = createCounter(debug, "expose-router-id");
85
89
  return {
86
90
  name: "@rangojs/router:expose-router-id",
87
91
  configResolved(config) {
88
92
  projectRoot = config.root;
89
93
  },
94
+ buildEnd() {
95
+ counter?.flush();
96
+ },
90
97
  transform(code, id) {
91
98
  if (!code.includes("createRouter")) return null;
92
99
  // Accepts both @rangojs/router and @rangojs/router/server subpath.
@@ -102,9 +109,19 @@ export function exposeRouterId(): Plugin {
102
109
  }
103
110
  if (id.includes("node_modules")) return null;
104
111
 
105
- const filePath = normalizePath(path.relative(projectRoot, id));
106
- const routerFnNames = getImportedFnNames(code, "createRouter");
107
- return transformRouter(code, filePath, routerFnNames, normalizePath(id));
112
+ const start = counter ? performance.now() : 0;
113
+ try {
114
+ const filePath = normalizePath(path.relative(projectRoot, id));
115
+ const routerFnNames = getImportedFnNames(code, "createRouter");
116
+ return transformRouter(
117
+ code,
118
+ filePath,
119
+ routerFnNames,
120
+ normalizePath(id),
121
+ );
122
+ } finally {
123
+ counter?.record(id, performance.now() - start);
124
+ }
108
125
  },
109
126
  };
110
127
  }