@wular/pnext 0.0.2 → 0.0.4

package/src/compat/register/segment.ts

@@ -918,6 +918,11 @@ const segmentPrefetchInterceptor: RequestInterceptor = async (request, ctx) => {
             'x-nextjs-postponed': '2',
             'x-nextjs-stale-time': String(staleTime),
             ...(isStatic ? { 'x-nextjs-prerender': '1' } : {}),
+            // Announce head outlining on the tree HEADERS too, so the client
+            // can keep head-before-body order without reading the tree body.
+            ...(selection?.route.pprMetadata === true
+              ? { 'x-pnext-head-outlined': headFetchedFirst(selection) ? 'first' : '1' }
+              : {}),
             'x-nextjs-deployment-id': deploymentId(),
             // A static route's baked tree is CDN-cacheable like Next's
             // prerendered payloads; the per-variant `_rsc` cache-buster keys
@@ -949,12 +954,17 @@ const segmentPrefetchInterceptor: RequestInterceptor = async (request, ctx) => {
       ? { headOutlined: true, ...(headFetchedFirst(selection) ? { headFirst: true } : {}) }
       : {}),
   });
-  return withRewriteHeaders(
-    withDeploymentId(
-      treePrefetchResponse(payload, { format: url.searchParams.has('_rsc') ? 'flight' : 'json' }),
-    ),
-    rewriteHeaders,
-  );
+  const treeResponse = treePrefetchResponse(payload, {
+    format: url.searchParams.has('_rsc') ? 'flight' : 'json',
+  });
+  // Mirror the payload's head-outlining on the HEADERS (see baked branch).
+  if (selection?.route.pprMetadata === true) {
+    treeResponse.headers.set(
+      'x-pnext-head-outlined',
+      headFetchedFirst(selection) ? 'first' : '1',
+    );
+  }
+  return withRewriteHeaders(withDeploymentId(treeResponse), rewriteHeaders);
 };
 
 /**

package/src/config.ts

@@ -14,7 +14,12 @@ export type ResolvedConfig = Required<Pick<PNextConfig, 'outDir' | 'basePath'>>
     publicDir: 'public';
     appPath: string;
     publicPath: string;
+    /** Where this process writes and serves from: the out root, or `<outRoot>/dev` in dev. */
     outPath: string;
+    /** The out root itself (`.pnext`), identical in dev and build. */
+    outRootPath: string;
+    /** Generated types — always under the out root, because tsconfig points at it. */
+    typesPath: string;
   };
 
 const defaultConfig = {
@@ -88,6 +93,7 @@ export async function loadConfig(
   const sourceOverrides = stripUndefined(await resolveConfigSource(config, root, options));
   const merged = { ...defaultConfig, ...config, ...sourceOverrides };
   const appPath = await resolveAppPath(root, config);
+  const outRootPath = path.resolve(root, merged.outDir);
   const workspaceRoot = canonicalRoot(
     config.workspaceRoot
       ? path.resolve(root, config.workspaceRoot)
@@ -113,10 +119,18 @@ export async function loadConfig(
     workspaceRoot,
     appPath,
     publicPath: path.resolve(root, 'public'),
-    outPath: path.resolve(root, merged.outDir),
+    // Dev owns `<outRoot>/dev` exclusively so a concurrent `pnext build` — which
+    // wipes its own outputs under the out root — can never pull a running dev
+    // server's cache, manifest or assets out from under it.
+    outPath: options.dev ? path.join(outRootPath, devOutSegment) : outRootPath,
+    outRootPath,
+    typesPath: path.join(outRootPath, 'types'),
   };
 }
 
+/** Dev's private subtree under the out root. Build never touches it. */
+export const devOutSegment = 'dev';
+
 // Relative-import resolution realpaths the importing file (so a materialized shim resolves `./sibling`
 // against real source), so every containment check against root/workspaceRoot compares realpaths.
 // Canonicalize the roots to match - otherwise an app served through a symlinked directory (a macOS

package/src/css/build.ts

@@ -1,7 +1,8 @@
 import { existsSync, readFileSync } from 'node:fs';
 import { writeFile } from 'node:fs/promises';
 import path from 'node:path';
-import { build, type Plugin } from 'esbuild';
+import type { Plugin } from 'esbuild';
+import { build } from '../utils/esbuild';
 import { ensureDir, readText } from '../utils/fs';
 import { postcssConfigFile, runPostcss } from './postcss';
 import { extraPageExtensions, getCssExtensions } from '../extensions';
@@ -19,7 +20,8 @@ interface Pending {
 }
 
 // Bun's Worker carries node's ref/unref; the DOM lib typing does not.
-type CssWorker = Worker & { ref(): void; unref(): void };
+// Bun's terminate() resolves once the thread is gone (lib.dom types it void).
+type CssWorker = Worker & { ref(): void; unref(): void; terminate(): Promise<void> };
 
 let worker: CssWorker | undefined;
 let workerFailed = false;
@@ -76,6 +78,15 @@ function send(request: (id: number) => CssWorkerRequest) {
 }
 
 /** Run the app's postcss pipeline over a built stylesheet, off the event loop. */
+// A live worker thread at process.exit races Bun's teardown (seen flipping the
+// exit code to 1 on Linux after a fully successful build); one-shot commands
+// terminate it explicitly before exiting.
+export async function stopCssWorker(): Promise<void> {
+  const active = worker;
+  worker = undefined;
+  if (active) await Promise.resolve(active.terminate());
+}
+
 export async function runPostcssOffThread(
   config: Pick<ResolvedConfig, 'root' | 'outPath'>,
   cssFile: string,

package/src/dev/imports.ts

@@ -4,7 +4,8 @@ import path from 'node:path';
 import { existsSync, readFileSync, type Dirent } from 'node:fs';
 import { fileURLToPath } from 'node:url';
 import { copyFile, mkdir, readdir, symlink, writeFile } from 'node:fs/promises';
-import { build, type OnResolveResult, type Plugin } from 'esbuild';
+import type { OnResolveResult, Plugin } from 'esbuild';
+import { build } from '../utils/esbuild';
 import { drainPreplanBuilds, vendorTraceEnabled, vendorTraceRow } from '../runtime/vendor';
 import {
   clientReferenceExportNames,
@@ -756,7 +757,10 @@ function devRouteBundlePlugin(config: ResolvedConfig, route: RouteManifestEntry)
     conditionTarget,
     reactServerLayer: true,
     externalLoadTarget: externalLoadTargetForConditionTarget(conditionTarget),
-    stubClientImports: reactCompatEnabled(config),
+    // Always stub 'use client' files, compat or not: a client module reached transitively through a
+    // server module would otherwise inline as an untagged bundle-local copy - markClientReferences then
+    // tags a different instance and the component never gets its hydration island.
+    stubClientImports: true,
     rewriteExternalServerImports: true,
     bundleExternalPackages: reactCompatEnabled(config),
   };
@@ -2174,15 +2178,40 @@ function devServerCacheKey(config: ResolvedConfig, file: string) {
   return path.join('external', `${hash}${path.extname(file) || '.js'}`);
 }
 
+// Bundle names memoized per (route, entries) so a warm request re-derives
+// nothing; any save clears the whole map (see clearDevRouteBundleKeys).
+const routeBundleKeys = new Map<string, Promise<string>>();
+
+/** A save may rename any route bundle: drop every memoized name. */
+export function clearDevRouteBundleKeys() {
+  routeBundleKeys.clear();
+}
+
 // The route bundle inlines the route file and its layouts, so its name carries
 // every source graph it bundles.
-async function devRouteBundlePath(
+function devRouteBundlePath(
   config: ResolvedConfig,
   route: RouteManifestEntry,
   layoutFiles: string[],
 ) {
-  const graph = devModuleGraph(config);
   const entries = uniqueFiles([route.file, ...layoutFiles]);
+  const memoKey = `${route.id}\0${entries.join('\0')}`;
+  const memoized = routeBundleKeys.get(memoKey);
+  if (memoized) return memoized;
+  const next = computeDevRouteBundlePath(config, route, entries).catch(error => {
+    routeBundleKeys.delete(memoKey);
+    throw error;
+  });
+  routeBundleKeys.set(memoKey, next);
+  return next;
+}
+
+async function computeDevRouteBundlePath(
+  config: ResolvedConfig,
+  route: RouteManifestEntry,
+  entries: string[],
+) {
+  const graph = devModuleGraph(config);
   const cached = await cachedRouteBundlePath(config, route.id, graph.graphKey, entries);
   if (cached) return cached;
   const hashes = await Promise.all(entries.map(file => graph.graphHash(file)));
@@ -2356,7 +2385,7 @@ function assetContextEntry(
     'pages',
     'public',
     'node_modules',
-    path.basename(config.outPath),
+    path.basename(config.outRootPath),
   ]).has(name);
 }
 

package/src/dev/module-cache.ts

@@ -25,6 +25,24 @@ export function devHeadTrimEnabled(): boolean {
   return process.env.PNEXT_HEAD_TRIM !== '0';
 }
 
+// While a recursive fs watcher is reporting every save, the memoized graph is
+// authoritative and a warm request needs no per-module re-stat; the dev server
+// marks its outPath once its watch roots are up and clears it if any root
+// fails. Per cache root, so other processes' caches (tests, one-off renders)
+// keep the stat-based freshness they rely on.
+// Bisect seam: PNEXT_DEV_WATCH_FRESHNESS=0 restores the per-request re-stat.
+const watcherFreshRoots = new Set<string>();
+
+export function setDevWatcherFreshness(outPath: string, trusted: boolean) {
+  if (trusted) watcherFreshRoots.add(cacheRoot(outPath));
+  else watcherFreshRoots.delete(cacheRoot(outPath));
+}
+
+function watcherFreshnessTrusted(root: string) {
+  // eslint-disable-next-line turbo/no-undeclared-env-vars
+  return watcherFreshRoots.has(root) && process.env.PNEXT_DEV_WATCH_FRESHNESS !== '0';
+}
+
 /** Files whose bytes are not source: hashed from stat, never read or scanned. */
 const BINARY_SOURCE = /\.(?:png|jpe?g|gif|webp|avif|ico|bmp|woff2?|ttf|otf|eot|mp[34]|webm|pdf)$/i;
 
@@ -289,6 +307,7 @@ function createDevModuleCache(
    * everywhere), and the disk is the only authority on what a module contains.
    */
   async function refresh(file: string) {
+    if (watcherFreshnessTrusted(root)) return;
     const reachable = closures.get(file);
     if (!reachable) return;
     if (passes > 0 && refreshedThisPass.has(file)) return;

package/src/dev/module-transform.ts

@@ -4,7 +4,13 @@
 //
 // esbuild's bundler is still load-bearing for a handful of shapes (below); `transformBailReason` sniffs
 // those out per file and the caller falls back to the esbuild build for them. Same pipeline in dev and prod.
-import { transformSync, type TransformOptions } from 'oxc-transform';
+import type { TransformOptions } from 'oxc-transform';
+
+// Lazy: the native binding costs ~3.6 MB RSS and a prod server never transforms.
+const transformSync: typeof import('oxc-transform').transformSync = (...args) =>
+  // eslint-disable-next-line @typescript-eslint/no-require-imports
+  loadNative(() => require('oxc-transform') as typeof import('oxc-transform')).transformSync(...args);
+import { loadNative } from '../utils/native-require';
 import { isCommonJsModuleSource } from '../resolve/imports';
 
 /** Why a source cannot take the transform path — one per esbuild-only shape. */

package/src/dev/server.ts

@@ -1,4 +1,4 @@
-import { existsSync, readFileSync } from 'node:fs';
+import { existsSync, readFileSync, statSync } from 'node:fs';
 import { createHash } from 'node:crypto';
 import { readFile, readdir, rm, stat, watch } from 'node:fs/promises';
 import path from 'node:path';
@@ -83,6 +83,7 @@ import { clearResolverFsCache } from '../resolve/engine';
 import { clearAppTreeResolutions, workspacePackageRoots } from '../resolve/imports';
 import type { RouteManifestEntry, RouteParamValue } from '../types';
 import {
+  clearDevRouteBundleKeys,
   devClientModuleHref,
   devModuleGraph,
   devRouteModuleLoaders,
@@ -90,7 +91,7 @@ import {
   warmDevModulePipeline,
 } from './imports';
 import { ssrClientReference } from '../client/reference';
-import { cacheRoot } from './module-cache';
+import { cacheRoot, setDevWatcherFreshness } from './module-cache';
 import { markBoot } from '../cli/boot-trace';
 
 interface DevServerOptions {
@@ -126,8 +127,15 @@ const indexedClientDirs = new Set<string>();
 // Layout chains per route file: findLayouts + an existsSync per level, which a
 // warm request would otherwise redo every time.
 const routeLayoutFiles = new Map<string, string[]>();
+// Keyed by app (outPath), not by asset path or route id alone: several dev
+// servers for different apps share one process in tests and monorepo tooling,
+// and a bare `/assets/global.css` or route id collides between them.
 const assetBuilds = new Map<string, Promise<unknown>>();
 const routeCacheKeys = new Map<string, Promise<string>>();
+const appKey = (outPath: string, key: string) => `${outPath}\0${key}`;
+function clearAppKeyed(map: Map<string, unknown>, outPath: string) {
+  for (const key of map.keys()) if (key.startsWith(`${outPath}\0`)) map.delete(key);
+}
 // Routes whose bundles this process has already compiled, so the "Compiling"
 // banner prints once per cold route (like Next.js) and not on warm hits.
 // Cleared on reload.
@@ -156,8 +164,9 @@ function invalidateDevCaches(config: ResolvedConfig, changed: string[], structur
   // Route CSS is derived from the whole source tree (Tailwind scans it), and
   // the client cache key is a content hash whose inputs just moved.
   clearGlobalCssSourceCache();
-  assetBuilds.clear();
-  routeCacheKeys.clear();
+  clearDevRouteBundleKeys();
+  clearAppKeyed(assetBuilds, config.outPath);
+  clearAppKeyed(routeCacheKeys, config.outPath);
   indexedClientDirs.clear();
   compiledRoutes.clear();
   // Long sessions accumulate one generation per save; sweep past the keep
@@ -213,6 +222,11 @@ async function removeLeakedStaleCaches(outPath: string) {
 
 export async function startDevServer(options: DevServerOptions) {
   const { config, port, hostname } = options;
+  // FSEvents replays writes that landed just before the watch started, so a server
+  // booted right after a checkout or scaffold reloads itself once for files it has
+  // already read. Nothing is compiled before the watcher, so anything this old is
+  // already in hand.
+  const bootTime = Date.now();
   // Spawn the CSS worker first: Tailwind's cold boot then runs off the event
   // loop, alongside everything below, instead of on the first page's stylesheet.
   warmCssPipeline(config, { dev: true });
@@ -260,6 +274,9 @@ export async function startDevServer(options: DevServerOptions) {
   // registry + client-stub set that startup/reload armed inline stay current.
   publishRuntime();
   const clients = new Set<DevEventClient>();
+  // Bumped on every rebuild broadcast and stamped on each stream's `ready`, so a
+  // client that reconnects (bfcache restore) can tell it missed one and reload.
+  let generation = 0;
   let watcher: DevWatcher | undefined;
   /** Requests currently being served — background work defers to them. */
   let inFlight = 0;
@@ -306,6 +323,7 @@ export async function startDevServer(options: DevServerOptions) {
     // table, the proxy or the client bundles - only the built CSS assets. The page swaps its <link>s
     // in place instead of navigating.
     if (isCssOnlyChange(change.files)) {
+      generation++;
       broadcast(clients, 'css-update');
       return;
     }
@@ -322,9 +340,20 @@ export async function startDevServer(options: DevServerOptions) {
     void typegenInBackground();
     watchedFactsVersion = -1;
     syncWatchRoots();
+    generation++;
     broadcast(clients, 'reload');
   }
 
+  // A save's visibility must not wait out the coalescing window: the moment the
+  // event lands, forget the changed file's graph and the memoized names derived
+  // from it, so a request racing the debounced reload already compiles fresh.
+  // The heavy reload work (proxy, typegen, route scan, CSS) stays debounced.
+  function eagerInvalidate(file: string) {
+    devModuleGraph(config).invalidate([file]);
+    clearDevRouteBundleKeys();
+    clearAppKeyed(routeCacheKeys, config.outPath);
+  }
+
   // Watch roots outside app/ come from route sourceFiles, which only exist once
   // a route has resolved its deferred facts — so they are re-derived whenever
   // another route materializes (its first compile), not once at boot.
@@ -332,7 +361,7 @@ export async function startDevServer(options: DevServerOptions) {
   function syncWatchRoots() {
     if (watchedFactsVersion === routeFactsVersion()) return;
     watchedFactsVersion = routeFactsVersion();
-    watcher = refreshWatcher(config, routes, watcher, reload);
+    watcher = refreshWatcher(config, routes, watcher, reload, bootTime, eagerInvalidate);
   }
 
   syncWatchRoots();
@@ -430,7 +459,7 @@ export async function startDevServer(options: DevServerOptions) {
 
         if (url.pathname === '/__pnext/events') {
           server.timeout(request, 0);
-          return finish(eventStream(clients));
+          return finish(eventStream(clients, generation));
         }
 
         const assetResponse = await profileDevStep(profile, 'built asset lookup', () =>
@@ -766,7 +795,7 @@ async function warmDevRoutes(config: ResolvedConfig, routes: RouteManifestEntry[
   // it twice). The stand-down covers the stylesheet too, not just the route loop: a page request
   // that arrived first is blocked on its own import, and global.css is a build it does not consume.
   if (deferAssetPreload() && pageRequestsSeen > 0) return;
-  await buildDevAsset('/assets/global.css', () => buildGlobalCss(config, { dev: true }));
+  await buildDevAsset(config, '/assets/global.css', () => buildGlobalCss(config, { dev: true }));
   for (const route of wanted) {
     if (pageRequestsSeen > 0) return;
     await warmDevRoute(config, route).catch(() => undefined);
@@ -780,7 +809,9 @@ async function warmDevRoute(config: ResolvedConfig, route: RouteManifestEntry) {
   const hasClient = route.client || route.clientReferences.length > 0;
   await Promise.allSettled([
     route.cssImports.length > 0
-      ? buildDevAsset(`/assets/${route.id}.css`, () => buildRouteCss(config, route, { dev: true }))
+      ? buildDevAsset(config, `/assets/${route.id}.css`, () =>
+          buildRouteCss(config, route, { dev: true }),
+        )
       : Promise.resolve(),
     devRouteModuleLoaders(config, route, layoutFiles),
     hasClient ? buildDevClient(config, route) : Promise.resolve(),
@@ -1017,12 +1048,14 @@ function preloadDevPageAssets(
   profile: DevRequestProfile | undefined,
 ) {
   void profileDevStep(profile, 'asset preload /assets/global.css', () =>
-    buildDevAsset('/assets/global.css', () => buildGlobalCss(config, { dev: true })),
+    buildDevAsset(config, '/assets/global.css', () => buildGlobalCss(config, { dev: true })),
   ).catch(error => logDevPreloadError('global css build', error));
 
   if (route.cssImports.length === 0) return;
   void profileDevStep(profile, `asset preload /assets/${route.id}.css`, () =>
-    buildDevAsset(`/assets/${route.id}.css`, () => buildRouteCss(config, route, { dev: true })),
+    buildDevAsset(config, `/assets/${route.id}.css`, () =>
+      buildRouteCss(config, route, { dev: true }),
+    ),
   ).catch(error => logDevPreloadError(`route css build for ${route.route}`, error));
 }
 
@@ -1270,7 +1303,7 @@ async function maybeBuiltAsset(
 ) {
   if (!pathname.startsWith('/assets/')) return null;
   if (pathname === '/assets/global.css') {
-    await buildDevAsset(pathname, () => buildGlobalCss(config, { dev: true }));
+    await buildDevAsset(config, pathname, () => buildGlobalCss(config, { dev: true }));
   } else {
     const cssMatch = /^\/assets\/(.+)\.css$/.exec(pathname);
     const route = cssMatch?.[1] ? routes.find(item => item.id === cssMatch[1]) : undefined;
@@ -1283,9 +1316,9 @@ async function maybeBuiltAsset(
           findClientReferenceCss(routes, cssMatch[1])
         : undefined;
     if (route) {
-      await buildDevAsset(pathname, () => buildRouteCss(config, route, { dev: true }));
+      await buildDevAsset(config, pathname, () => buildRouteCss(config, route, { dev: true }));
     } else if (reference) {
-      await buildDevAsset(pathname, () =>
+      await buildDevAsset(config, pathname, () =>
         buildClientReferenceCss(config, reference, { dev: true }),
       );
     }
@@ -1301,7 +1334,8 @@ async function maybeBuiltAsset(
   });
 }
 
-function buildDevAsset(key: string, build: () => Promise<unknown>) {
+function buildDevAsset(config: ResolvedConfig, pathname: string, build: () => Promise<unknown>) {
+  const key = appKey(config.outPath, pathname);
   const existing = assetBuilds.get(key);
   if (existing) return existing;
   // Build each asset once per dev version (reload() clears it); drop on failure to allow retry.
@@ -1418,8 +1452,8 @@ function logDevPageAbort(pending: PendingDevPageLoadLog | undefined) {
 // so the several-second cold esbuild + Tailwind build isn't a silent stall. The
 // timed `page GET ... in Xs` line follows once the response resolves.
 function noteDevCompileStart(route: RouteManifestEntry) {
-  if (compiledRoutes.has(route.id)) return;
-  compiledRoutes.add(route.id);
+  if (compiledRoutes.has(route.file)) return;
+  compiledRoutes.add(route.file);
   console.log(`${cyan('○')} ${dim('Compiling')} ${cyan(route.route)} ${dim('...')}`);
 }
 
@@ -1534,12 +1568,14 @@ function refreshWatcher(
   routes: RouteManifestEntry[],
   current: DevWatcher | undefined,
   onChange: (change: DevChange) => Promise<void>,
+  bootTime: number,
+  onEvent: (file: string) => void,
 ) {
   const roots = devWatchRoots(config, routes);
   const rootsKey = roots.join('\0');
   if (current?.rootsKey === rootsKey) return current;
   current?.stop();
-  return watchRoots(roots, rootsKey, onChange);
+  return watchRoots(roots, rootsKey, config.outPath, onChange, bootTime, onEvent);
 }
 
 function devWatchRoots(config: ResolvedConfig, routes: RouteManifestEntry[]) {
@@ -1606,10 +1642,17 @@ interface DevChange {
   renamed: boolean;
 }
 
+// Once any watch root fails (recursive watch unsupported), the graph goes back
+// to re-stating on every request for the life of the process.
+let recursiveWatchBroken = false;
+
 function watchRoots(
   roots: string[],
   rootsKey: string,
+  outPath: string,
   onChange: (change: DevChange) => Promise<void>,
+  bootTime: number,
+  onEvent: (file: string) => void,
 ): DevWatcher {
   const controller = new AbortController();
   let pending: Timer | undefined;
@@ -1630,6 +1673,8 @@ function watchRoots(
   }
 
   function schedule(file: string, renamed: boolean) {
+    if (predatesBoot(file, bootTime)) return;
+    onEvent(file);
     batch.files.push(file);
     batch.renamed ||= renamed;
     if (pending) clearTimeout(pending);
@@ -1646,8 +1691,12 @@ function watchRoots(
   }
 
   for (const root of roots) {
-    void watchRoot(root, controller.signal, schedule);
+    void watchRoot(root, controller.signal, schedule, () => {
+      recursiveWatchBroken = true;
+      setDevWatcherFreshness(outPath, false);
+    });
   }
+  if (!recursiveWatchBroken) setDevWatcherFreshness(outPath, true);
 
   return {
     rootsKey,
@@ -1658,10 +1707,27 @@ function watchRoots(
   };
 }
 
+/** A replayed pre-boot event: still on disk, unchanged since before the server read it. */
+function predatesBoot(file: string, bootTime: number) {
+  const info = statSync(file, { throwIfNoEntry: false });
+  return Boolean(info?.isFile() && info.mtimeMs <= bootTime);
+}
+
+// Output and dependency churn is not a save: .pnext (the server's own cache
+// persists + typegen land there and used to reload the world on every warm
+// request), other dot dirs, and node_modules.
+const ignoredWatchSegment = /(?:^|[\\/])(?:node_modules|\.[^\\/]+)(?:[\\/]|$)/;
+
+/** @internal Test-only: is this root-relative watch event output/dependency churn? */
+export function isIgnoredWatchPath(relativeFile: string) {
+  return ignoredWatchSegment.test(relativeFile);
+}
+
 async function watchRoot(
   root: string,
   signal: AbortSignal,
   onChange: (file: string, structural: boolean) => void,
+  onBroken: () => void,
 ) {
   try {
     const watcher = watch(root, { recursive: true, signal });
@@ -1669,21 +1735,24 @@ async function watchRoot(
       // No filename (rare, platform-dependent) means we cannot scope the
       // invalidation: treat it as structural so everything is re-derived.
       if (!event.filename) onChange(root, true);
-      else onChange(path.resolve(root, event.filename), event.eventType === 'rename');
+      else if (!ignoredWatchSegment.test(event.filename))
+        onChange(path.resolve(root, event.filename), event.eventType === 'rename');
     }
   } catch (error) {
     if (signal.aborted || (error instanceof Error && error.name === 'AbortError')) return;
-    // Some platforms do not support recursive watch. Dev still works without live reload.
+    // Some platforms do not support recursive watch. Dev still works without
+    // live reload, but the graph must then re-stat on every request.
+    onBroken();
   }
 }
 
-function eventStream(clients: Set<DevEventClient>) {
+function eventStream(clients: Set<DevEventClient>, generation: number) {
   let client: DevEventClient | undefined;
   const stream = new ReadableStream<Uint8Array>({
     start(controller) {
       client = { controller };
       clients.add(client);
-      controller.enqueue(new TextEncoder().encode('event: ready\ndata: ok\n\n'));
+      controller.enqueue(new TextEncoder().encode(`event: ready\ndata: ${generation}\n\n`));
     },
     cancel() {
       if (client) clients.delete(client);