veryfront 0.1.128 → 0.1.129

package/src/src/server/handlers/request/module/module-server-handler.ts

@@ -3,6 +3,7 @@ import type { HandlerContext, HandlerResult } from "../../types.js";
 import { ResponseBuilder } from "../../../../security/index.js";
 import { withSpan } from "../../../../observability/tracing/otlp-setup.js";
 import { resolveProjectReactVersion } from "../../../../transforms/esm/package-registry.js";
+import { profilePhase } from "../../../../observability/request-profiler.js";
 
 export function handleModuleServer(
   req: dntShim.Request,
@@ -18,24 +19,30 @@ export function handleModuleServer(
     "module.server.handle",
     async () => {
       try {
-        const reactVersion = await resolveProjectReactVersion({
-          projectDir: ctx.projectDir,
-          config: ctx.config,
-        });
+        const reactVersion = await profilePhase(
+          "module.resolve_react_version",
+          () =>
+            resolveProjectReactVersion({
+              projectDir: ctx.projectDir,
+              config: ctx.config,
+            }),
+        );
 
-        const { serveModule } = await import("../../../../modules/server/index.js");
-        const moduleResponse = await serveModule(req, {
-          projectId: ctx.projectId ?? ctx.projectDir,
-          projectDir: ctx.projectDir,
-          adapter: ctx.adapter,
-          dev: !!ctx.isLocalProject,
-          projectUUID: ctx.projectId,
-          projectSlug: ctx.projectSlug,
-          branch: ctx.parsedDomain?.branch ?? null,
-          releaseId: ctx.releaseId ?? null,
-          allowedImportDirs: ctx.config?.security?.allowedImportDirs,
-          reactVersion,
-          mode: ctx.requestContext?.mode,
+        const moduleResponse = await profilePhase("module.serve", async () => {
+          const { serveModule } = await import("../../../../modules/server/index.js");
+          return await serveModule(req, {
+            projectId: ctx.projectId ?? ctx.projectDir,
+            projectDir: ctx.projectDir,
+            adapter: ctx.adapter,
+            dev: !!ctx.isLocalProject,
+            projectUUID: ctx.projectId,
+            projectSlug: ctx.projectSlug,
+            branch: ctx.parsedDomain?.branch ?? null,
+            releaseId: ctx.releaseId ?? null,
+            allowedImportDirs: ctx.config?.security?.allowedImportDirs,
+            reactVersion,
+            mode: ctx.requestContext?.mode,
+          });
         });
 
         const response = createResponseBuilder(ctx)

package/src/src/server/handlers/request/prod-hydration-module.handler.ts

@@ -0,0 +1,61 @@
+import * as dntShim from "../../../../_dnt.shims.js";
+import { BaseHandler } from "../response/base.js";
+import type { HandlerContext, HandlerMetadata, HandlerPriority, HandlerResult } from "../types.js";
+import {
+  generateProdHydrationModule,
+  PROD_HYDRATION_MODULE_PATH,
+} from "../../../html/hydration-script-builder/prod-scripts.js";
+import { computeStrongEtag, hasMatchingEtag } from "../utils/etag.js";
+import { HTTP_OK, PRIORITY_HIGH_DEV } from "../../../utils/constants/index.js";
+
+let cachedModule: { js: string; etag: string } | null = null;
+
+function getProdHydrationModuleBundle(): { js: string; etag: string } {
+  if (cachedModule) return cachedModule;
+
+  const js = generateProdHydrationModule();
+  cachedModule = {
+    js,
+    etag: computeStrongEtag(js),
+  };
+  return cachedModule;
+}
+
+export class ProdHydrationModuleHandler extends BaseHandler {
+  metadata: HandlerMetadata = {
+    name: "ProdHydrationModuleHandler",
+    priority: PRIORITY_HIGH_DEV as HandlerPriority,
+    patterns: [
+      { pattern: PROD_HYDRATION_MODULE_PATH, exact: true, method: "GET" },
+      { pattern: PROD_HYDRATION_MODULE_PATH, exact: true, method: "HEAD" },
+    ],
+  };
+
+  async handle(req: dntShim.Request, ctx: HandlerContext): Promise<HandlerResult> {
+    if (!this.shouldHandle(req, ctx)) {
+      return this.continue();
+    }
+
+    const method = req.method.toUpperCase();
+    const { js, etag } = getProdHydrationModuleBundle();
+    const builder = this.createResponseBuilder(ctx).withCORS(req, ctx.securityConfig?.cors);
+
+    if (hasMatchingEtag(req, etag)) {
+      return this.respond(
+        builder.withSecurity(ctx.securityConfig ?? undefined, req).notModified(etag),
+      );
+    }
+
+    return this.respond(
+      builder
+        .withSecurity(ctx.securityConfig ?? undefined, req)
+        .withCache("no-cache")
+        .withETag(etag)
+        .withContentType(
+          "application/javascript; charset=utf-8",
+          method === "HEAD" ? null : js,
+          HTTP_OK,
+        ),
+    );
+  }
+}

package/src/src/server/handlers/request/ssr/ssr.handler.ts

@@ -193,6 +193,8 @@ export class SSRHandler extends BaseHandler {
         const pageId = url.searchParams.get("page_id") || undefined;
         const noHmr = url.searchParams.get("noHmr") === "1" ||
           url.searchParams.get("no_hmr") === "1";
+        const forceProductionScripts = url.searchParams.get("forceProductionScripts") === "1" ||
+          url.searchParams.get("force_production_scripts") === "1";
         const useNoCache = shouldUseNoCacheHeadersFromHandler(ctx);
 
         const result = await this.ssrService.renderPage(ctx, {
@@ -204,6 +206,7 @@ export class SSRHandler extends BaseHandler {
           projectId,
           pageId,
           noHmr,
+          forceProductionScripts,
           useNoCache,
         });
 

package/src/src/server/production-server.ts

@@ -18,6 +18,14 @@ import {
   stopMemoryMonitoring,
 } from "../utils/memory/index.js";
 import { initializeDistributedCaches } from "../cache/distributed-cache-init.js";
+import { getConfig } from "../config/index.js";
+import { resolveStyleContentVersion } from "../html/styles-builder/content-version.js";
+import {
+  buildPreparedCSSArtifactFromFiles,
+  collectLocalProjectSourceFiles,
+  readLocalProjectStylesheet,
+} from "../html/styles-builder/css-pregeneration.js";
+import { createStyleScopeProfile } from "../html/styles-builder/style-scope-profile.js";
 import { setServerInitialized } from "./handlers/monitoring/health.handler.js";
 import {
   enableSSRClientOnlyFetching,
@@ -39,6 +47,74 @@ const DEFAULT_SHUTDOWN_DRAIN_TIMEOUT_MS = 25_000;
 /** Default port when PORT / VERYFRONT_PORT env vars are not set */
 const DEFAULT_SERVER_PORT = 3_000;
 
+async function prewarmLocalProductionCSSArtifacts(
+  adapter: RuntimeAdapter,
+  options: Pick<
+    StartProductionServerOptions,
+    | "projectDir"
+    | "defaultProjectSlug"
+    | "defaultProjectId"
+    | "defaultEnvironment"
+    | "localProjects"
+  >,
+): Promise<void> {
+  if (options.defaultEnvironment !== "production") return;
+
+  const projectsToWarm = new Map<string, string>();
+
+  if (options.localProjects) {
+    for (const [projectSlug, projectDir] of Object.entries(options.localProjects)) {
+      projectsToWarm.set(projectSlug, projectDir);
+    }
+  }
+
+  if (options.defaultProjectSlug && options.projectDir) {
+    projectsToWarm.set(options.defaultProjectSlug, options.projectDir);
+  } else if (projectsToWarm.size === 0 && options.defaultProjectId && options.projectDir) {
+    projectsToWarm.set(options.defaultProjectId, options.projectDir);
+  }
+
+  if (projectsToWarm.size === 0) return;
+
+  await Promise.all([...projectsToWarm.entries()].map(async ([projectSlug, projectDir]) => {
+    try {
+      const config = await getConfig(projectDir, adapter, { cacheKey: projectSlug });
+      const styleProfile = createStyleScopeProfile(config);
+      const files = await collectLocalProjectSourceFiles({
+        projectDir,
+        styleProfile,
+      });
+      const stylesheet = await readLocalProjectStylesheet(projectDir, config?.tailwind?.stylesheet);
+
+      const result = await buildPreparedCSSArtifactFromFiles({
+        projectSlug,
+        projectVersion: resolveStyleContentVersion(null),
+        projectDir,
+        files,
+        styleProfile,
+        stylesheet,
+        stylesheetPath: config?.tailwind?.stylesheet,
+        minify: true,
+        environment: "preview",
+        buildMode: "production",
+      });
+
+      serverLog.debug("Prewarmed local production CSS artifact", {
+        projectSlug,
+        projectDir,
+        fileCount: files.length,
+        fromCache: result.fromCache,
+      });
+    } catch (error) {
+      serverLog.debug("Skipping local production CSS prewarm", {
+        projectSlug,
+        projectDir,
+        error: error instanceof Error ? error.message : String(error),
+      });
+    }
+  }));
+}
+
 /** Configuration for AI primitives discovery during server startup */
 export interface DiscoveryOptions {
   baseDir: string;
@@ -117,6 +193,14 @@ export function startProductionServer(
         logger.debug("FSAdapter initialized", { type: bootstrap.fsAdapterType });
       }
 
+      await prewarmLocalProductionCSSArtifacts(bootstrap.adapter, {
+        projectDir,
+        defaultProjectSlug,
+        defaultProjectId,
+        defaultEnvironment,
+        localProjects,
+      });
+
       // Enable SSR fetch interception to handle relative URLs during SSR
       setSSRServerPort(port);
       enableSSRFetchInterception();

package/src/src/server/runtime-handler/handler-context-builder.ts

@@ -19,7 +19,7 @@ import type { RouteRegistry } from "../../routing/registry/index.js";
 import { buildEnrichedContext } from "../context/enriched-context.js";
 import { computeContentSourceId } from "../../cache/keys.js";
 
-interface HandlerContextOptions {
+export interface HandlerContextOptions {
   /** Project directory */
   projectDir: string;
   /** Runtime adapter */

package/src/src/server/runtime-handler/index.ts

@@ -34,6 +34,10 @@ import { CsrfHandler } from "../../security/http/csrf/csrf-handler.js";
 import { CorsHandler } from "../handlers/response/cors.js";
 import { HealthHandler } from "../handlers/monitoring/health.handler.js";
 import { MetricsHandler } from "../handlers/monitoring/metrics.handler.js";
+import {
+  finalizeRequestProfiling,
+  runWithRequestProfiling,
+} from "../../observability/request-profiler.js";
 import { ClientLogHandler } from "../handlers/monitoring/client-log.handler.js";
 import { MemoryDebugHandler } from "../handlers/monitoring/memory.handler.js";
 import { DevEndpointsHandler } from "../handlers/dev/endpoints.handler.js";
@@ -44,6 +48,7 @@ import { StudioBridgeModulesHandler } from "../handlers/studio/bridge-modules.ha
 import { StaticHandler } from "../handlers/request/static.handler.js";
 import { SnippetHandler } from "../handlers/request/snippet.handler.js";
 import { LibModulesHandler } from "../handlers/request/lib-modules.handler.js";
+import { ProdHydrationModuleHandler } from "../handlers/request/prod-hydration-module.handler.js";
 import { CSSHandler } from "../handlers/request/css.handler.js";
 import { RSCHandler } from "../handlers/request/rsc/index.js";
 import { ModuleHandler } from "../handlers/request/module/index.js";
@@ -99,6 +104,7 @@ import {
   isLightweightPath,
   isMonitoringPath,
   isWebSocketPath,
+  shouldSkipEnrichedContext,
 } from "./request-utils.js";
 import { withRequestTimeout } from "./timeout-manager.js";
 import {
@@ -138,6 +144,7 @@ export const HANDLER_NAMES = [
   "DevDashboardHandler",
   "ProjectsHandler",
   "StudioBridgeModulesHandler",
+  "ProdHydrationModuleHandler",
   "CSSHandler",
   "DevFileHandler",
   "SnippetHandler",
@@ -192,6 +199,7 @@ const handlerFactories: Record<
   DevDashboardHandler: () => new DevDashboardHandler(),
   ProjectsHandler: () => new ProjectsHandler(),
   StudioBridgeModulesHandler: () => new StudioBridgeModulesHandler(),
+  ProdHydrationModuleHandler: () => new ProdHydrationModuleHandler(),
   CSSHandler: () => new CSSHandler(),
   DevFileHandler: () => new DevFileHandler(),
   SnippetHandler: () => new SnippetHandler(),
@@ -551,7 +559,7 @@ export function createVeryfrontHandler(
             return envRes.errorResponse;
           }
 
-          const isInternalAgentControlPlanePath = url.pathname.startsWith("/internal/agents/");
+          const skipRenderEnrichedContext = shouldSkipEnrichedContext(url.pathname);
 
           // Build handler context
           const ctx = buildHandlerContext({
@@ -573,7 +581,7 @@ export function createVeryfrontHandler(
             isLocalProject: adapterRes.isLocalProject,
             moduleServerUrl: opts.moduleServerUrl,
             environmentId: headers.environmentId,
-            skipEnrichedContext: isInternalAgentControlPlanePath,
+            skipEnrichedContext: skipRenderEnrichedContext,
           });
 
           // Fetch per-project env vars for remote projects
@@ -604,18 +612,41 @@ export function createVeryfrontHandler(
           // reqCtx.token indicates the request came through the proxy with auth.
           // Without it (standalone / test), host env must remain accessible.
           const shouldIsolateEnv = !adapterRes.isLocalProject && !!reqCtx.token;
-          const response = await withSpan(
-            SpanNames.HANDLER_EXECUTE,
-            () => {
-              if (shouldIsolateEnv) {
-                return runWithProjectEnv(envVarsForRequest, executeRoute);
-              }
-              return executeRoute();
-            },
+          const response = await runWithRequestProfiling(
             {
-              "handler.project_slug": projectRes.projectSlug || "unknown",
-              "handler.path": url.pathname,
-              "handler.method": req.method,
+              category: url.pathname.startsWith("/_vf_styles/")
+                ? "css"
+                : url.pathname.startsWith("/_vf_modules/")
+                ? "module"
+                : url.pathname.startsWith("/api/")
+                ? "api"
+                : "html",
+              method: req.method,
+              pathname: url.pathname,
+              projectSlug: projectRes.projectSlug,
+              requestMode: envRes.resolvedEnvironment,
+            },
+            async () => {
+              let routedResponse: dntShim.Response | null | undefined;
+              try {
+                routedResponse = await withSpan(
+                  SpanNames.HANDLER_EXECUTE,
+                  () => {
+                    if (shouldIsolateEnv) {
+                      return runWithProjectEnv(envVarsForRequest, executeRoute);
+                    }
+                    return executeRoute();
+                  },
+                  {
+                    "handler.project_slug": projectRes.projectSlug || "unknown",
+                    "handler.path": url.pathname,
+                    "handler.method": req.method,
+                  },
+                );
+                return routedResponse;
+              } finally {
+                finalizeRequestProfiling(routedResponse?.status);
+              }
             },
           );
 

package/src/src/server/runtime-handler/request-utils.ts

@@ -59,6 +59,7 @@ export function isMonitoringPath(pathname: string): boolean {
 export const LIGHTWEIGHT_PATH_PREFIXES = [
   "/_vf_modules/",
   "/_veryfront/modules/",
+  "/_veryfront/hydration-runtime.js",
   "/_veryfront/preview-hmr.js",
   "/_veryfront/studio-bridge.js",
   "/_vf/css/",
@@ -74,3 +75,13 @@ export function isLightweightPath(pathname: string): boolean {
 export function isWebSocketPath(pathname: string): boolean {
   return pathname === "/_ws";
 }
+
+/**
+ * Requests that do not need render-specific enriched context.
+ *
+ * These routes still receive the normal handler context, but they can skip
+ * render cache prefix/content-source derivation and the enriched render payload.
+ */
+export function shouldSkipEnrichedContext(pathname: string): boolean {
+  return pathname.startsWith("/api/") || pathname.startsWith("/internal/agents/");
+}

package/src/src/server/services/rendering/ssr.service.ts

@@ -12,9 +12,11 @@ import { VeryfrontError } from "../../../errors/index.js";
 import { getColorSchemeFromRequest } from "../../../security/http/client-hints.js";
 import {
   endRenderSession,
+  hasRenderSession,
   startRenderSession,
 } from "../../../transforms/mdx/esm-module-loader/module-fetcher/index.js";
 import { getErrorCollector } from "../../../observability/error-collector.js";
+import { profilePhase } from "../../../observability/request-profiler.js";
 import { ErrorOverlay, parseErrorLocation } from "../../dev-server/error-overlay/index.js";
 import { ErrorPages } from "../../utils/error-html.js";
 import {
@@ -77,6 +79,7 @@ export interface SSRRenderOptions {
   projectId?: string;
   pageId?: string;
   noHmr: boolean;
+  forceProductionScripts?: boolean;
   useNoCache: boolean;
 }
 
@@ -170,22 +173,28 @@ export class SSRService implements SSRServiceLike {
       });
 
       const renderStartTime = performance.now();
-      const result = await timeAsync("render-page", () =>
-        renderer.renderPage(slug, {
-          delivery: "stream",
-          request,
-          url,
-          nonce,
-          studioEmbed,
-          projectId,
-          pageId,
-          colorScheme,
-          colorSchemeFromParam,
-          colorSchemeFromHeader,
-          environment: ctx.requestContext?.mode,
-          projectSlug: ctx.projectSlug,
-          noHmr,
-        }));
+      const result = await profilePhase(
+        "ssr.render_page",
+        () =>
+          timeAsync("render-page", () =>
+            renderer.renderPage(slug, {
+              delivery: "stream",
+              request,
+              url,
+              nonce,
+              studioEmbed,
+              projectId,
+              pageId,
+              colorScheme,
+              colorSchemeFromParam,
+              colorSchemeFromHeader,
+              environment: ctx.requestContext?.mode,
+              projectSlug: ctx.projectSlug,
+              noHmr,
+              forceProductionScripts: options.forceProductionScripts,
+              renderSessionId,
+            })),
+      );
 
       logger.debug("renderPage DONE", {
         projectSlug: ctx.projectSlug,
@@ -195,7 +204,9 @@ export class SSRService implements SSRServiceLike {
         hasStream: !!result.stream,
       });
 
-      endRenderSession(renderSessionId);
+      if (hasRenderSession(renderSessionId)) {
+        endRenderSession(renderSessionId);
+      }
 
       const postRenderHeap = getHeapStats();
       const heapGrowthMB = postRenderHeap.usedHeapSizeMB - preRenderHeap.usedHeapSizeMB;
@@ -225,7 +236,9 @@ export class SSRService implements SSRServiceLike {
         slug,
       };
     } catch (error) {
-      endRenderSession(renderSessionId);
+      if (hasRenderSession(renderSessionId)) {
+        endRenderSession(renderSessionId);
+      }
       return this.handleRenderError(error, ctx, slug, request, nonce);
     }
   }