@kudzujs/core 0.8.52 → 0.8.55

package/framework/build.mjs

@@ -8,9 +8,11 @@ import { generateListRuntime } from "./compiler/list-runtime-codegen.mjs"
 import { assetPath, browserPath, relativeModulePath, withBase } from "./compiler/path-helpers.mjs"
 import { createProjectSession } from "./compiler/project-session.mjs"
 import { createRouteBuildRecord, planRouteArtifacts } from "./compiler/route-build-record.mjs"
+import { createRouteArtifactReport } from "./compiler/route-artifact-report.mjs"
+import { planRuntimeFamilies } from "./compiler/runtime-family-planner.mjs"
 import { createSourceCompiler } from "./compiler/source-compiler.mjs"
 import { createParamCodegen } from "./compiler/param-codegen.mjs"
-import { planRouteCapabilities, usesRouteDependencyRuntime } from "./compiler/route-capability-planner.mjs"
+import { usesRouteDependencyRuntime } from "./compiler/route-capability-planner.mjs"
 import { generateBindingRuntime, generateCoreRuntime, generateEffectRuntime, generateNativeRuntime, generateNavigationRuntime, specializeRuntime } from "./compiler/runtime-codegen.mjs"
 import { renderPage } from "./core.mjs"
 import { parseDevHost, parseDevPort, startDevServer } from "./dev-server.mjs"
@@ -62,9 +64,10 @@ async function buildInto(project, outputDirectory, { minify }) {
   const config = await loadConfig(root)
   const base = normalizeBase(config.base)
   const configuredStyles = normalizeStyles(config.styles, base, project)
+  const globalStyleUrls = [...new Set(configuredStyles.urls)]
+  const globalStyleUrlSet = new Set(globalStyleUrls)
   const publicDirectory = normalizePublicDirectory(config.publicDir, project)
   const navigationGroups = normalizeNavigation(config.navigation)
-  const navigationRoutes = navigationGroups.flatMap(group => group.routes)
   const navigationByRoute = new Map(navigationGroups.flatMap(group => group.routes.map(route => [route, group])))
   for (const group of navigationGroups) {
     group.assetPath = assetPath(base, `assets/${group.assetName}`)
@@ -72,6 +75,7 @@ async function buildInto(project, outputDirectory, { minify }) {
     group.layoutId = `l-${group.id}`
     group.records = []
     group.routeRecords = []
+    group.buildRecords = []
     group.hasEffects = false
     group.hasParams = false
   }
@@ -82,7 +86,6 @@ async function buildInto(project, outputDirectory, { minify }) {
   const projectFiles = await walk(sourceDirectory)
   const allSourceFiles = projectFiles.filter(file => /\.(?:ts|tsx)$/.test(file) && !file.endsWith(".d.ts")).sort()
   const configuredStyleSources = new Set(configuredStyles.sources.map(style => style.source))
-  const discoveredCssFiles = projectFiles.filter(file => file.toLowerCase().endsWith(".css") && !configuredStyleSources.has(file)).sort()
   if (!allSourceFiles.length) throw new Error("No TypeScript files found in src/")
   const allSourceFileSet = new Set(allSourceFiles)
   const sourceIndex = project.sourceIndex
@@ -93,7 +96,8 @@ async function buildInto(project, outputDirectory, { minify }) {
   const sourceFileSet = project.sourceFiles
   for (const file of sourceFiles) sourceFileSet.add(file)
   const staticFiles = await safeStaticFiles(projectFiles)
-  const cssFiles = orderSourceStyles(discoveredCssFiles, sourceFiles, sourceIndex, staticFiles)
+  const stylesByPage = new Map(pageFiles.map(file => [file, orderSourceStyles([file], sourceFiles, sourceIndex, staticFiles).filter(style => !configuredStyleSources.has(style))]))
+  const cssFiles = [...new Set([...stylesByPage.values()].flat())]
   const importedAssets = new Set()
   const { cssModules, cssOutputs } = await prepareSourceStyles(cssFiles, staticFiles, importedAssets, base, project)
 
@@ -114,7 +118,8 @@ async function buildInto(project, outputDirectory, { minify }) {
     return effect.workers.map(worker => ({ ...worker, module: assetPath(base, `assets/${result.handlerModule.path}`), handler: handler.exportName }))
   }))
 
-  const routeRecords = []
+  let routeRecords = []
+  const routeDrafts = []
   const routeEntryTransforms = new Map()
   const routeEntrySources = new Map()
   const routeEntryPaths = new Map()
@@ -122,13 +127,14 @@ async function buildInto(project, outputDirectory, { minify }) {
   const emittedRoutes = new Set()
   const emittedApplicationRoutes = new Set()
   const emittedNavigationRecords = []
-  const styleUrls = [...new Set([
-    ...cssFiles.map(file => assetPath(base, `assets/${relative(sourceDirectory, file).replaceAll(sep, "/")}`)),
-    ...configuredStyles.urls
-  ])]
+  const navigationAssets = new Map()
   const runtimePlaceholder = `/__kudzu_runtime_${randomUUID()}.js`
+  const bindingPlaceholder = `/__kudzu_binding_${randomUUID()}.js`
+  const listPlaceholder = `/__kudzu_list_${randomUUID()}.js`
 
   for (const pageFile of pageFiles) {
+    const sourceStyleUrls = stylesByPage.get(pageFile).map(file => assetPath(base, `assets/${relative(sourceDirectory, file).replaceAll(sep, "/")}`)).filter(url => !globalStyleUrlSet.has(url))
+    const styleUrls = [...sourceStyleUrls, ...globalStyleUrls]
     const compiledFile = compiledPath(pageFile)
     const module = await import(`${pathToFileURL(compiledFile).href}?v=${Date.now()}`)
     if (typeof module.default !== "function") throw new Error(`${relative(root, pageFile)} must export a default component`)
@@ -156,6 +162,7 @@ async function buildInto(project, outputDirectory, { minify }) {
       const pageMetadata = await resolveDocumentMetadata(module.metadata, metadataContext, `${relative(root, pageFile)} metadata`)
       const navigationGroup = navigationByRoute.get(applicationRoute)
       const navigable = Boolean(navigationGroup)
+      if (navigationGroup) navigationAssets.set(routePath, navigationGroup.assetPath)
       const effectPath = `effects/${route ? `${route}/index` : "index"}.js`
       const nativePath = `native/${route ? `${route}/index` : "index"}.js`
       const paramPath = `params/${route ? `${route}/index` : "index"}.js`
@@ -179,8 +186,11 @@ async function buildInto(project, outputDirectory, { minify }) {
         ...configuredMetadata,
         ...pageMetadata,
         styles: styleUrls.length ? styleUrls : false,
+        managedStyles: navigable ? sourceStyleUrls : [],
         base,
         runtimeAsset: runtimePlaceholder,
+        bindingAsset: bindingPlaceholder,
+        listAsset: listPlaceholder,
         effectAsset: assetPath(base, `assets/${effectPath}`),
         nativeAsset: assetPath(base, `assets/${nativePath}`),
         paramAsset: assetPath(base, `assets/${paramPath}`),
@@ -192,30 +202,16 @@ async function buildInto(project, outputDirectory, { minify }) {
         navigationGroup.hasParams ||= result.hasParams
       }
       const usesDependencyRuntime = usesRouteDependencyRuntime({ plan: result.plan, navigable, hasBindings: result.hasBindings, hasLists: result.hasLists })
-      const routeRuntimeName = usesDependencyRuntime ? "kudzu-deps.js" : "kudzu.js"
       const plan = { route: routePath, ...result.plan }
-      const entries = {}
-      let html = inlineQueryFormCarry(result.html, plan)
-      if (result.hasParams) {
-        const entry = retainRouteEntry(paramPath, output => printParamEntry(runtimeSchema, plan.params, plan.searchParams, plan.searchParamsWritable, output, join(outputDirectory, "assets"), base, routeRuntimeName, navigable), routeEntrySources, routeEntryPaths, outputDirectory)
-        entries.param = entry.path
-        html = html.replaceAll(assetPath(base, `assets/${paramPath}`), assetPath(base, `assets/${entry.path}`))
+      const entries = {
+        ...(result.hasParams ? { param: paramPath } : {}),
+        ...(result.hasEffects ? { effect: effectPath } : {}),
+        ...(plan.events.some(event => event.native) ? { native: nativePath } : {})
       }
-      if (result.hasEffects) {
-        const entry = retainRouteEntry(effectPath, output => printEffectEntry(runtimeEffects(plan.effects, navigable), output, handlerModules, join(outputDirectory, "assets"), base, entries.param, routeRuntimeName, navigable), routeEntrySources, routeEntryPaths, outputDirectory)
-        entries.effect = entry.path
-        html = html.replaceAll(assetPath(base, `assets/${effectPath}`), assetPath(base, `assets/${entry.path}`))
-      }
-      if (plan.events.some(event => event.native)) {
-        const modules = [...new Set(plan.events.filter(event => event.native).map(event => event.native.module))]
-        const entry = retainRouteEntry(nativePath, () => printNativeEntrySource(modules, base), routeEntrySources, routeEntryPaths, outputDirectory)
-        entries.native = entry.path
-        html = html.replaceAll(assetPath(base, `assets/${nativePath}`), assetPath(base, `assets/${entry.path}`))
-      }
-      routeRecords.push(createRouteBuildRecord({
+      const record = createRouteBuildRecord({
         route: routePath,
         output: route,
-        html,
+        html: inlineQueryFormCarry(result.html, plan),
         plan,
         handlerReferences: result.handlerReferences,
         styles: styleUrls,
@@ -232,7 +228,10 @@ async function buildInto(project, outputDirectory, { minify }) {
         },
         entries,
         runtimeSchema
-      }))
+      })
+      routeRecords.push(record)
+      if (navigationGroup) navigationGroup.buildRecords.push(record)
+      routeDrafts.push({ record, result, runtimeSchema, navigationGroup, effectPath, nativePath, paramPath })
     }
   }
 
@@ -244,12 +243,65 @@ async function buildInto(project, outputDirectory, { minify }) {
     group.records.sort((left, right) => (right.segments?.filter(segment => segment !== null).length ?? 0) - (left.segments?.filter(segment => segment !== null).length ?? 0) || left.id.localeCompare(right.id))
   }
 
+  const runtimePlan = planRuntimeFamilies(routeRecords, navigationGroups)
+  for (const group of navigationGroups) {
+    group.runtimeFamily = runtimePlan.familyByRecord.get(group.buildRecords[0])
+    group.assetPath = assetPath(base, `assets/runtime/${group.runtimeFamily.id}/${group.assetName}`)
+  }
+  const runtimeFamilyByRecord = new Map()
+  routeRecords = routeDrafts.map(draft => {
+    const { record, result, runtimeSchema, navigationGroup, effectPath, nativePath, paramPath } = draft
+    const family = runtimePlan.familyByRecord.get(record)
+    if (record.capabilities.hasBehaviors && !family) throw new Error(`Interactive route has no runtime family: ${record.route}`)
+    const runtimeDirectory = family ? join(outputDirectory, "assets", "runtime", family.id) : undefined
+    const routeRuntimeName = record.capabilities.usesDependencyRuntime ? "kudzu-deps.js" : "kudzu.js"
+    const entries = {}
+    let html = record.html
+    if (record.capabilities.hasParams) {
+      const entry = retainRouteEntry(paramPath, output => printParamEntry(runtimeSchema, record.plan.params, record.plan.searchParams, record.plan.searchParamsWritable, output, runtimeDirectory, base, routeRuntimeName, record.capabilities.navigable), routeEntrySources, routeEntryPaths, outputDirectory)
+      entries.param = entry.path
+      html = html.replaceAll(assetPath(base, `assets/${paramPath}`), assetPath(base, `assets/${entry.path}`))
+    }
+    if (record.capabilities.hasEffects) {
+      const entry = retainRouteEntry(effectPath, output => printEffectEntry(runtimeEffects(record.plan.effects, record.capabilities.navigable), output, handlerModules, join(outputDirectory, "assets"), base, entries.param, routeRuntimeName, record.capabilities.navigable, runtimeDirectory), routeEntrySources, routeEntryPaths, outputDirectory)
+      entries.effect = entry.path
+      html = html.replaceAll(assetPath(base, `assets/${effectPath}`), assetPath(base, `assets/${entry.path}`))
+    }
+    if (record.plan.events.some(event => event.native)) {
+      const modules = [...new Set(record.plan.events.filter(event => event.native).map(event => event.native.module))]
+      const nativeRuntime = assetPath(base, `assets/runtime/${family.id}/kudzu-native.js`)
+      const entry = retainRouteEntry(nativePath, () => printNativeEntrySource(modules, nativeRuntime), routeEntrySources, routeEntryPaths, outputDirectory)
+      entries.native = entry.path
+      html = html.replaceAll(assetPath(base, `assets/${nativePath}`), assetPath(base, `assets/${entry.path}`))
+    }
+    if (family) {
+      html = html.replaceAll(runtimePlaceholder, escapeAttribute(assetPath(base, `assets/runtime/${family.id}/${routeRuntimeName}`)))
+      html = html.replaceAll(bindingPlaceholder, escapeAttribute(assetPath(base, `assets/runtime/${family.id}/kudzu-binding.js`)))
+      html = html.replaceAll(listPlaceholder, escapeAttribute(assetPath(base, `assets/runtime/${family.id}/kudzu-list.js`)))
+    }
+    if (navigationGroup) html = html.replaceAll(escapeAttribute(navigationAssets.get(record.route)), escapeAttribute(navigationGroup.assetPath))
+    const finalRecord = createRouteBuildRecord({
+      route: record.route,
+      output: record.output,
+      html,
+      plan: record.plan,
+      handlerReferences: result.handlerReferences,
+      styles: record.artifacts.styles,
+      capabilities: record.capabilities,
+      entries,
+      runtimeSchema
+    })
+    if (family) runtimeFamilyByRecord.set(finalRecord, family)
+    if (navigationGroup) navigationAssets.set(finalRecord.route, navigationGroup.assetPath)
+    return finalRecord
+  })
+
   const assetsDirectory = join(outputDirectory, "assets")
   await mkdir(assetsDirectory, { recursive: true })
   const { handlerModules: emittedHandlerModules, workerReferences: renderedWorkerReferences, styles: renderedStyles } = planRouteArtifacts(routeRecords, handlerModules, workerReferences, module => assetPath(base, `assets/${module.path}`))
   const renderedStyleUrls = new Set(renderedStyles)
   if (renderedWorkerReferences.length && await exists(join(publicDirectory, "assets", "workers"))) throw new Error("public/assets/workers collides with Kudzu's generated Worker asset namespace")
-  const workerAssets = await project.workerCompiler.emit(renderedWorkerReferences, sourceFileSet, assetsDirectory, base, minify)
+  const { assets: workerAssets, outputs: workerOutputs } = await project.workerCompiler.emit(renderedWorkerReferences, sourceFileSet, assetsDirectory, base, minify)
   for (const module of emittedHandlerModules) {
     for (const reference of workerReferences) {
       if (reference.module !== assetPath(base, `assets/${module.path}`)) continue
@@ -259,63 +311,55 @@ async function buildInto(project, outputDirectory, { minify }) {
     if (module.code.includes("/__kudzu_worker_")) throw new Error(`Worker URL placeholder survived in ${module.path}`)
   }
   const plans = routeRecords.map(record => record.plan)
-  const capabilityIR = planRouteCapabilities(routeRecords, { navigationRouteCount: navigationRoutes.length })
-  const {
-    routes: { behaviors: behaviorCount, regularBehaviors: regularBehaviorCount, dependencyStateSeeds: dependencyStateSeedCount },
-    events: { command: commandEvents, hasNativeHandlers },
-    bindings: { count: bindingCount },
-    lists,
-    effects: { any: hasEffects, derivedDependencies: hasDerivedEffectDependencies, captures: hasEffectCaptures },
-    captures: { nestedState: hasNestedStateCaptures, setter: hasSetterCaptures },
-    runtime: { shared: hasSharedRuntime, dependency: hasDependencyRuntime }
-  } = capabilityIR
-  const runtimeName = usesDependencyRuntime => usesDependencyRuntime ? "kudzu-deps.js" : "kudzu.js"
+  const behaviorCount = routeRecords.filter(record => record.capabilities.hasBehaviors).length
   for (let offset = 0; offset < routeRecords.length; offset += 64) {
     await Promise.all(routeRecords.slice(offset, offset + 64).map(async record => {
       const routeDirectory = join(outputDirectory, record.output)
       await mkdir(routeDirectory, { recursive: true })
-      const html = preloadModules(record.html.replace(runtimePlaceholder, escapeAttribute(assetPath(base, `assets/${runtimeName(record.capabilities.usesDependencyRuntime)}`))))
-      await writeFile(join(routeDirectory, "index.html"), html)
+      if ([runtimePlaceholder, bindingPlaceholder, listPlaceholder].some(placeholder => record.html.includes(placeholder))) throw new Error(`Runtime family placeholder survived in ${record.route}`)
+      await writeFile(join(routeDirectory, "index.html"), preloadModules(record.html))
     }))
   }
-  if (navigationRoutes.length || behaviorCount && (hasSharedRuntime || regularBehaviorCount)) {
-    const runtimeFile = hasSharedRuntime ? "./shared-runtime.js" : "./runtime.js"
-    const runtime = generateCoreRuntime(await readFile(new URL(runtimeFile, import.meta.url), "utf8"), capabilityIR)
-    await writeJavaScript(join(assetsDirectory, "kudzu.js"), runtime, minify)
-  }
-  if (hasDependencyRuntime) {
-    const runtime = specializeRuntime(await readFile(new URL("./dependency-runtime.js", import.meta.url), "utf8"), commandEvents, dependencyStateSeedCount > 0)
-    await writeJavaScript(join(assetsDirectory, "kudzu-deps.js"), runtime, minify)
-  }
-  if (bindingCount || hasNativeHandlers || hasEffectCaptures) await writeJavaScript(join(assetsDirectory, "kudzu-serialization.js"), await readFile(new URL("./serialization.js", import.meta.url), "utf8"), minify, {
-    "globalThis.__KUDZU_CAPTURE_STATE__": String(hasNestedStateCaptures),
-    "globalThis.__KUDZU_CAPTURE_SETTER__": String(hasSetterCaptures)
-  })
-  if (hasEffects) {
-    const generated = generateEffectRuntime(await readFile(new URL("./effect-runtime.js", import.meta.url), "utf8"), capabilityIR)
-    await writeBundledJavaScript(join(assetsDirectory, "kudzu-effect.js"), generated.source, minify, generated.define)
-  }
-  if (bindingCount || lists.styleCount) await writeJavaScript(join(assetsDirectory, "kudzu-style.js"), await readFile(new URL("./style.js", import.meta.url), "utf8"), minify)
-  if (bindingCount) {
-    const generated = generateBindingRuntime(await readFile(new URL("./binding-runtime.js", import.meta.url), "utf8"), capabilityIR, navigationRoutes.length > 0)
-    await writeBundledJavaScript(join(assetsDirectory, "kudzu-binding.js"), generated.source, minify, generated.define)
-  }
-  if (hasDerivedEffectDependencies) await writeJavaScript(join(assetsDirectory, "kudzu-collection-selector.js"), await readFile(new URL("./collection-selector.js", import.meta.url), "utf8"), minify)
-  if (lists.count) {
-    if (lists.selectors && !hasDerivedEffectDependencies) await writeJavaScript(join(assetsDirectory, "kudzu-collection-selector.js"), await readFile(new URL("./collection-selector.js", import.meta.url), "utf8"), minify)
-    const generated = generateListRuntime(await readFile(new URL("./list-runtime.js", import.meta.url), "utf8"), capabilityIR)
-    await writeBundledJavaScript(join(assetsDirectory, "kudzu-list.js"), generated.source, minify, generated.define)
-    if (lists.selectors && !hasDerivedEffectDependencies) await rm(join(assetsDirectory, "kudzu-collection-selector.js"))
-  }
-  if (hasNativeHandlers) {
-    const generated = generateNativeRuntime(await readFile(new URL("./native-runtime.js", import.meta.url), "utf8"), capabilityIR)
-    await writeJavaScript(join(assetsDirectory, "kudzu-native.js"), generated.source, minify, generated.define)
-    for (const [path, source] of routeEntrySources) if (path.startsWith("native/")) await writeRetainedRouteEntry(path, source, assetsDirectory, minify, routeEntryTransforms)
+  for (const family of runtimePlan.families) {
+    const capabilityIR = family.capability
+    const { bindings, captures, effects, events, lists, routes, runtime } = capabilityIR
+    const familyDirectory = join(assetsDirectory, "runtime", family.id)
+    await mkdir(familyDirectory, { recursive: true })
+    if (runtime.dependency) {
+      const source = await readFile(new URL("./dependency-runtime.js", import.meta.url), "utf8")
+      await writeJavaScript(join(familyDirectory, "kudzu-deps.js"), specializeRuntime(source, events.command, routes.dependencyStateSeeds > 0), minify)
+    } else {
+      const source = await readFile(new URL(runtime.shared ? "./shared-runtime.js" : "./runtime.js", import.meta.url), "utf8")
+      await writeJavaScript(join(familyDirectory, "kudzu.js"), generateCoreRuntime(source, capabilityIR), minify)
+    }
+    if (bindings.count || events.hasNativeHandlers || effects.captures) await writeJavaScript(join(familyDirectory, "kudzu-serialization.js"), await readFile(new URL("./serialization.js", import.meta.url), "utf8"), minify, {
+      "globalThis.__KUDZU_CAPTURE_STATE__": String(captures.nestedState),
+      "globalThis.__KUDZU_CAPTURE_SETTER__": String(captures.setter)
+    })
+    if (effects.any) {
+      const generated = generateEffectRuntime(await readFile(new URL("./effect-runtime.js", import.meta.url), "utf8"), capabilityIR)
+      await writeBundledJavaScript(join(familyDirectory, "kudzu-effect.js"), generated.source, minify, generated.define)
+    }
+    if (bindings.count || lists.styleCount) await writeJavaScript(join(familyDirectory, "kudzu-style.js"), await readFile(new URL("./style.js", import.meta.url), "utf8"), minify)
+    if (bindings.count) {
+      const generated = generateBindingRuntime(await readFile(new URL("./binding-runtime.js", import.meta.url), "utf8"), capabilityIR, family.navigation)
+      await writeBundledJavaScript(join(familyDirectory, "kudzu-binding.js"), generated.source, minify, generated.define)
+    }
+    if (effects.derivedDependencies || lists.selectors) await writeJavaScript(join(familyDirectory, "kudzu-collection-selector.js"), await readFile(new URL("./collection-selector.js", import.meta.url), "utf8"), minify)
+    if (lists.count) {
+      const generated = generateListRuntime(await readFile(new URL("./list-runtime.js", import.meta.url), "utf8"), capabilityIR)
+      await writeBundledJavaScript(join(familyDirectory, "kudzu-list.js"), generated.source, minify, generated.define)
+    }
+    if (events.hasNativeHandlers) {
+      const generated = generateNativeRuntime(await readFile(new URL("./native-runtime.js", import.meta.url), "utf8"), capabilityIR)
+      await writeJavaScript(join(familyDirectory, "kudzu-native.js"), generated.source, minify, generated.define)
+    }
   }
+  for (const [path, source] of routeEntrySources) if (path.startsWith("native/")) await writeRetainedRouteEntry(path, source, assetsDirectory, minify, routeEntryTransforms)
   if (navigationGroups.length) {
     const navigationSource = await readFile(new URL("./navigation-runtime.js", import.meta.url), "utf8")
     for (const group of navigationGroups) {
-      await writeJavaScript(join(assetsDirectory, group.assetName), generateNavigationRuntime(navigationSource, group), minify)
+      await writeJavaScript(join(assetsDirectory, "runtime", group.runtimeFamily.id, group.assetName), generateNavigationRuntime(navigationSource, group), minify)
     }
   }
   for (const handlerModule of emittedHandlerModules) {
@@ -332,8 +376,9 @@ async function buildInto(project, outputDirectory, { minify }) {
     await mkdir(dirname(output), { recursive: true })
     await writeJavaScript(output, module.code, minify)
   }
+  let handlerMetafile
   if (clientModules.length || emittedHandlerModules.some(module => module.hasPackageImports)) {
-    await bundle({
+    const result = await bundle({
       entryPoints: emittedHandlerModules.map(module => join(assetsDirectory, module.path)),
       outbase: join(assetsDirectory, "handlers"),
       outdir: join(assetsDirectory, "handlers"),
@@ -346,22 +391,29 @@ async function buildInto(project, outputDirectory, { minify }) {
       target: "es2022",
       minify,
       legalComments: "none",
+      metafile: true,
       logLevel: "silent"
     })
+    handlerMetafile = result.metafile
     await rm(join(assetsDirectory, "modules"), { recursive: true, force: true })
   }
   const sortedRewrites = rewrites.sort((left, right) => runtimeSpecificity(right) - runtimeSpecificity(left) || left.pattern.localeCompare(right.pattern))
   await writeFile(join(workDirectory, "kudzu-plan.json"), JSON.stringify({ routes: plans, rewrites: sortedRewrites }, null, 2))
+  const artifacts = createRouteArtifactReport(routeRecords, { base, handlerMetafile, outputDirectory, navigationAssets, runtimeFamilies: runtimePlan.families, runtimeFamilyByRecord, workerReferences: renderedWorkerReferences, workerOutputs })
+  await writeFile(join(workDirectory, "kudzu-artifacts.json"), JSON.stringify(artifacts, null, 2))
+  const emittedCssFiles = new Set()
   for (const file of cssFiles.filter(file => renderedStyleUrls.has(assetPath(base, `assets/${relative(sourceDirectory, file).replaceAll(sep, "/")}`)))) {
     const output = join(assetsDirectory, relative(sourceDirectory, file))
     await mkdir(dirname(output), { recursive: true })
     await writeFile(output, cssOutputs.get(file))
+    emittedCssFiles.add(file)
   }
   for (const file of [...importedAssets].sort()) {
-    if (cssOutputs.has(file)) continue
     const output = join(assetsDirectory, relative(sourceDirectory, file))
     await mkdir(dirname(output), { recursive: true })
-    await writeFile(output, await readFile(file))
+    if (cssOutputs.has(file)) {
+      if (!emittedCssFiles.has(file)) await writeFile(output, cssOutputs.get(file))
+    } else await writeFile(output, await readFile(file))
   }
   for (const style of configuredStyles.sources.filter(style => renderedStyleUrls.has(withBase(base, style.output)))) {
     let css = await readFile(style.source, "utf8")
@@ -380,7 +432,7 @@ async function buildInto(project, outputDirectory, { minify }) {
   }
   if (config.afterBuild !== undefined) {
     if (typeof config.afterBuild !== "function") throw new Error("kudzu.config afterBuild must be a function")
-    await config.afterBuild({ root, outDir: outputDirectory, sourceDir: sourceDirectory, base, routes: plans.map(plan => plan.route), plans, rewrites: sortedRewrites })
+    await config.afterBuild({ root, outDir: outputDirectory, sourceDir: sourceDirectory, base, routes: plans.map(plan => plan.route), plans, rewrites: sortedRewrites, artifacts })
   }
 
   return { result: { sourceResults }, pageCount: plans.length, behaviorCount }
@@ -485,10 +537,9 @@ function inlineQueryFormCarry(html, plan) {
   return html.replace("</body>", `${script}</body>`)
 }
 
-function printNativeEntrySource(modules, base) {
+function printNativeEntrySource(modules, runtime) {
   const imports = modules.map((module, index) => `import * as __kNativeModule${index} from ${JSON.stringify(module)}`).join("\n")
   const registrations = modules.map((module, index) => `[${JSON.stringify(module)}, __kNativeModule${index}]`).join(",")
-  const runtime = assetPath(base, "assets/kudzu-native.js")
   return `import { registerNativeModules } from ${JSON.stringify(runtime)}\n${imports}\nregisterNativeModules([${registrations}])`
 }
 
@@ -541,7 +592,7 @@ async function writeBundledJavaScript(file, source, minify, define) {
     stdin: { contents: source, resolveDir: dirname(file), sourcefile: file },
     bundle: true,
     write: false,
-    external: ["./kudzu.js", "./kudzu-binding.js", "./kudzu-serialization.js", "./kudzu-style.js"],
+    external: ["./kudzu.js", "./kudzu-binding.js", "./kudzu-collection-selector.js", "./kudzu-serialization.js", "./kudzu-style.js"],
     define,
     format: "esm",
     target: "es2022",

package/framework/compiler/effect-codegen.mjs

@@ -1,7 +1,7 @@
 import { join } from "node:path"
 
 export function createEffectCodegen({ assetPath, inlineJson, relativeModulePath }) {
-function printEffectEntry(effects, output, handlerModules, assetsDirectory, base, paramPath, runtimeName) {
+function printEffectEntry(effects, output, handlerModules, assetsDirectory, runtimeDirectory, base, paramPath, runtimeName) {
   const hasCleanup = effects.some(effect => effect.cleanup)
   const hasDependencies = effects.some(effect => effect.dependencies?.length || effect.itemDependencies?.length)
   const hasOwners = effects.some(effect => effect.owner)
@@ -14,10 +14,10 @@ function printEffectEntry(effects, output, handlerModules, assetsDirectory, base
   })
   const imports = [
     hasCleanup || hasDependencies || hasOwners
-      ? `import * as __kRuntime from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, runtimeName)))}\nconst { browserState, commitDom } = __kRuntime`
-      : `import { browserState, commitDom } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, runtimeName)))}`,
-    `import { createEffectContext } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu-effect.js")))}`,
-    ...(hasDependencyExpressions ? [`import { evaluateCollectionExpression as __kEvaluateDependency } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu-collection-selector.js")))}`] : []),
+      ? `import * as __kRuntime from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, runtimeName)))}\nconst { browserState, commitDom } = __kRuntime`
+      : `import { browserState, commitDom } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, runtimeName)))}`,
+    `import { createEffectContext } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu-effect.js")))}`,
+    ...(hasDependencyExpressions ? [`import { evaluateCollectionExpression as __kEvaluateDependency } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu-collection-selector.js")))}`] : []),
     ...(paramPath ? [`import ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, paramPath)))}`] : []),
     ...modules.map((module, index) => `import * as __kEffectModule${index} from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, module.path)))}`)
   ]
@@ -178,7 +178,7 @@ addEventListener("pagehide", event => {
 })`
 }
 
-function printNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, base) {
+function printNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, runtimeDirectory, base) {
   const hasDependencyExpressions = effects.some(effect => effect.dependencyExpressions?.length)
   const moduleUrls = [...new Set(effects.map(effect => effect.module))]
   const modules = moduleUrls.map(url => {
@@ -187,9 +187,9 @@ function printNavigableEffectEntry(effects, output, handlerModules, assetsDirect
     return module
   })
   const imports = [
-    `import * as __kRuntime from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu.js")))}`,
-    `import { createEffectContext } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu-effect.js")))}`,
-    ...(hasDependencyExpressions ? [`import { evaluateCollectionExpression as __kEvaluateDependency } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu-collection-selector.js")))}`] : []),
+    `import * as __kRuntime from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu.js")))}`,
+    `import { createEffectContext } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu-effect.js")))}`,
+    ...(hasDependencyExpressions ? [`import { evaluateCollectionExpression as __kEvaluateDependency } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu-collection-selector.js")))}`] : []),
     ...modules.map((module, index) => `import * as __kEffectModule${index} from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, module.path)))}`)
   ]
   const entries = moduleUrls.map((url, index) => `[${JSON.stringify(url)}, __kEffectModule${index}]`).join(",")
@@ -300,7 +300,7 @@ ${hasDependencyExpressions ? printDerivedDependencyRead("__kRuntime.browserState
 }`
 }
 
-function printOwnedNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, base) {
+function printOwnedNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, runtimeDirectory, base) {
   const hasItemDependencies = effects.some(effect => effect.itemDependencies?.length)
   const hasDependencyExpressions = effects.some(effect => effect.dependencyExpressions?.length)
   const moduleUrls = [...new Set(effects.map(effect => effect.module))]
@@ -310,9 +310,9 @@ function printOwnedNavigableEffectEntry(effects, output, handlerModules, assetsD
     return module
   })
   const imports = [
-    `import * as __kRuntime from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu.js")))}`,
-    `import { createEffectContext } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu-effect.js")))}`,
-    ...(hasDependencyExpressions ? [`import { evaluateCollectionExpression as __kEvaluateDependency } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, "kudzu-collection-selector.js")))}`] : []),
+    `import * as __kRuntime from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu.js")))}`,
+    `import { createEffectContext } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu-effect.js")))}`,
+    ...(hasDependencyExpressions ? [`import { evaluateCollectionExpression as __kEvaluateDependency } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, "kudzu-collection-selector.js")))}`] : []),
     ...modules.map((module, index) => `import * as __kEffectModule${index} from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, module.path)))}`)
   ]
   const entries = moduleUrls.map((url, index) => `[${JSON.stringify(url)}, __kEffectModule${index}]`).join(",")
@@ -876,9 +876,9 @@ async function invokeCleanup() {
 }${disposal}`
 }
 
-return (effects, output, handlerModules, assetsDirectory, base, paramPath, runtimeName, navigable) => navigable
+return (effects, output, handlerModules, assetsDirectory, base, paramPath, runtimeName, navigable, runtimeDirectory = assetsDirectory) => navigable
   ? effects.some(effect => effect.owner)
-    ? printOwnedNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, base)
-    : printNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, base)
-  : printEffectEntry(effects, output, handlerModules, assetsDirectory, base, paramPath, runtimeName)
+    ? printOwnedNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, runtimeDirectory, base)
+    : printNavigableEffectEntry(effects, output, handlerModules, assetsDirectory, runtimeDirectory, base)
+  : printEffectEntry(effects, output, handlerModules, assetsDirectory, runtimeDirectory, base, paramPath, runtimeName)
 }

package/framework/compiler/param-codegen.mjs

@@ -1,7 +1,7 @@
 import { join } from "node:path"
 
 export function createParamCodegen({ browserPath, inlineJson, relativeModulePath }) {
-  return function printParamEntry(schema, params, searchParams, searchParamsWritable, output, assetsDirectory, base, runtimeName, navigable) {
+  return function printParamEntry(schema, params, searchParams, searchParamsWritable, output, runtimeDirectory, base, runtimeName, navigable) {
     const hasSearch = searchParams.length || searchParamsWritable
     const signature = hasSearch ? "pathname, search" : "pathname"
     const prefix = navigable ? `export function initializeParams(${signature}) {\n${searchParamsWritable ? "globalThis.__kSetSearchParams = setSearchParams\n" : ""}` : `${schema ? "let pathname = location.pathname\n" : ""}${hasSearch ? "let search = location.search\n" : ""}`
@@ -66,7 +66,7 @@ function setSearchParams(update, replace) {
 }
 ${navigable ? "" : `globalThis.__kSetSearchParams = setSearchParams
 addEventListener("popstate", () => ${searchParams.length ? "initializeSearch(location.search)" : "undefined"})`}` : ""
-    return `import { browserState, commitDom } from ${JSON.stringify(relativeModulePath(output, join(assetsDirectory, runtimeName)))}
+    return `import { browserState, commitDom } from ${JSON.stringify(relativeModulePath(output, join(runtimeDirectory, runtimeName)))}
 ${searchInitializer}${prefix}${pathname}${query}${suffix}${writer}`
   }
 }

package/framework/compiler/route-artifact-report.mjs

@@ -0,0 +1,133 @@
+import { dirname, relative, resolve, sep } from "node:path"
+import { assetPath } from "./path-helpers.mjs"
+import { assertRouteBuildRecord } from "./route-build-record.mjs"
+import { planRouteCapabilities } from "./route-capability-planner.mjs"
+import { capabilitySignature, planRuntimeFamilies } from "./runtime-family-planner.mjs"
+
+export function createRouteArtifactReport(records, {
+  base = "",
+  handlerMetafile,
+  outputDirectory,
+  navigationAssets = new Map(),
+  runtimeFamilies,
+  runtimeFamilyByRecord,
+  workerReferences = [],
+  workerOutputs = new Map()
+} = {}) {
+  for (const record of records) assertRouteBuildRecord(record)
+  if (!runtimeFamilies || !runtimeFamilyByRecord) ({ families: runtimeFamilies, familyByRecord: runtimeFamilyByRecord } = planRuntimeFamilies(records))
+  const handlerGraph = handlerMetafile ? outputGraph(handlerMetafile, outputDirectory, base) : new Map()
+  const routes = records.map(record => {
+    const capability = planRouteCapabilities([record], { navigationRouteCount: Number(record.capabilities.navigable) })
+    const handlerEntries = [...new Set(record.artifacts.handlers.map(reference => reference.module))].sort()
+    const handlerOutputs = closure(handlerEntries, handlerGraph, Boolean(handlerMetafile))
+    const workers = workerReferences
+      .filter(reference => record.artifacts.effects.some(effect => effect.module === reference.module && effect.handler === reference.handler))
+      .map(reference => {
+        const output = workerOutputs.get(reference.placeholder)
+        if (!output) throw new Error(`Worker output was not recorded: ${reference.root}`)
+        return { source: reference.root, entry: output.entry, chunks: [...output.chunks].sort() }
+      })
+      .sort((left, right) => left.source.localeCompare(right.source) || left.entry.localeCompare(right.entry))
+    return {
+      route: record.route,
+      capability: {
+        signature: capabilitySignature(capability),
+        manifest: capability
+      },
+      runtime: routeRuntimeEdges(record, capability, runtimeFamilyByRecord.get(record), base, navigationAssets.get(record.route)),
+      handlers: {
+        entries: handlerEntries,
+        chunks: handlerOutputs.filter(output => !handlerEntries.includes(output))
+      },
+      workers,
+      styles: [...record.artifacts.styles].sort()
+    }
+  }).sort((left, right) => left.route.localeCompare(right.route))
+  const owners = new Map()
+  for (const route of routes) {
+    for (const path of [...route.handlers.chunks, ...route.workers.flatMap(worker => worker.chunks)]) {
+      const paths = owners.get(path) ?? new Set()
+      paths.add(route.route)
+      owners.set(path, paths)
+    }
+  }
+  return {
+    version: 2,
+    runtimeFamilies: runtimeFamilies.map(family => ({
+      id: family.id,
+      signature: family.signature,
+      navigation: family.navigation,
+      routes: records.filter(record => runtimeFamilyByRecord.get(record)?.id === family.id).map(record => record.route).sort(),
+      manifest: family.capability,
+      requirements: familyRuntimeRequirements(family, base)
+    })),
+    routes,
+    sharedChunks: [...owners].filter(([, routes]) => routes.size > 1).map(([path, routes]) => ({ path, routes: [...routes].sort() })).sort((left, right) => left.path.localeCompare(right.path))
+  }
+}
+
+function routeRuntimeEdges(record, capability, family, base, navigationAsset) {
+  const entries = Object.values(record.entries).map(path => assetPath(base, `assets/${path}`))
+  if (navigationAsset) entries.push(navigationAsset)
+  if (!family) return { family: null, entries: [...new Set(entries)].sort(), requirements: [] }
+  const modules = []
+  const add = name => modules.push(runtimeAsset(base, family.id, name))
+  if (record.capabilities.hasBehaviors || record.capabilities.navigable) add(record.capabilities.usesDependencyRuntime ? "kudzu-deps.js" : "kudzu.js")
+  if (record.capabilities.hasBindings) add("kudzu-binding.js")
+  if (record.capabilities.hasLists) add("kudzu-list.js")
+  if (record.capabilities.hasBindings || record.capabilities.hasLists && family.capability.lists.styleCount) add("kudzu-style.js")
+  if (capability.effects.derivedDependencies || record.capabilities.hasLists && family.capability.lists.selectors) add("kudzu-collection-selector.js")
+  if (record.capabilities.hasBindings || capability.events.hasNativeHandlers || record.capabilities.hasEffects && family.capability.effects.captures) add("kudzu-serialization.js")
+  if (record.capabilities.hasEffects) add("kudzu-effect.js")
+  if (capability.events.hasNativeHandlers) add("kudzu-native.js")
+  return { family: family.id, entries: [...new Set(entries)].sort(), requirements: [...new Set(modules)].sort() }
+}
+
+function familyRuntimeRequirements(family, base) {
+  const { bindings, effects, events, lists, runtime } = family.capability
+  const names = [runtime.dependency ? "kudzu-deps.js" : "kudzu.js"]
+  if (bindings.count || events.hasNativeHandlers || effects.captures) names.push("kudzu-serialization.js")
+  if (effects.any) names.push("kudzu-effect.js")
+  if (bindings.count || lists.styleCount) names.push("kudzu-style.js")
+  if (bindings.count) names.push("kudzu-binding.js")
+  if (effects.derivedDependencies || lists.selectors) names.push("kudzu-collection-selector.js")
+  if (lists.count) names.push("kudzu-list.js")
+  if (events.hasNativeHandlers) names.push("kudzu-native.js")
+  return names.map(name => runtimeAsset(base, family.id, name)).sort()
+}
+
+const runtimeAsset = (base, id, name) => assetPath(base, `assets/runtime/${id}/${name}`)
+
+function outputGraph(metafile, outputDirectory, base) {
+  if (!metafile || typeof metafile !== "object" || !metafile.outputs || typeof metafile.outputs !== "object") throw new Error("Invalid esbuild metafile")
+  if (typeof outputDirectory !== "string") throw new Error("Route artifact reporting requires an output directory")
+  const paths = new Map()
+  for (const output of Object.keys(metafile.outputs)) paths.set(resolve(output), outputUrl(resolve(output), outputDirectory, base))
+  const graph = new Map()
+  for (const [output, metadata] of Object.entries(metafile.outputs)) {
+    const absolute = resolve(output)
+    const url = paths.get(absolute)
+    const imports = (metadata.imports ?? []).filter(entry => !entry.external).map(entry => paths.get(resolve(entry.path)) ?? paths.get(resolve(dirname(absolute), entry.path))).filter(Boolean)
+    graph.set(url, [...new Set(imports)].sort())
+  }
+  return graph
+}
+
+function outputUrl(output, outputDirectory, base) {
+  const path = relative(outputDirectory, output)
+  if (!path || path === ".." || path.startsWith(`..${sep}`)) throw new Error(`Bundled output is outside the build directory: ${output}`)
+  return assetPath(base, path.replaceAll(sep, "/"))
+}
+
+function closure(entries, graph, requireEntries) {
+  const visited = new Set()
+  const visit = output => {
+    if (visited.has(output)) return
+    if (requireEntries && !graph.has(output)) throw new Error(`Bundled handler entry was not emitted: ${output}`)
+    visited.add(output)
+    for (const imported of graph.get(output) ?? []) visit(imported)
+  }
+  for (const entry of entries) visit(entry)
+  return [...visited].sort()
+}