release: WRNexusJS 0.7.0

packages/dev-server/src/runtime.ts

@@ -1,3 +1,4 @@
+import { brotliCompressSync, constants as zlibConstants } from "node:zlib";
 /**
  * Shared request runtime used by BOTH the dev server and the production server.
  *
@@ -35,6 +36,13 @@ import {
   type SeoConfig,
   type TFunction,
 } from "@wrnexus/core";
+import { requestHardening } from "@wrnexus/security";
+import {
+  createWebVitalsHandler,
+  defaultMetrics,
+  metricsMiddleware,
+  webVitalsClient,
+} from "@wrnexus/observability";
 import type { Router } from "@wrnexus/router";
 import { renderDocument, type RenderScript, type ScriptAsset } from "@wrnexus/ssr";
 import {
@@ -142,7 +150,7 @@ export interface RuntimeDeps {
   /** Package browser runtimes resolved by the plugin system. */
   clientRuntimes?: ClientRuntimeDefinition[];
   /** Page navigation strategy. `document` disables same-origin link interception. */
-  navigation?: { mode?: "client" | "document" };
+  navigation?: { mode?: "auto" | "client" | "document" };
   /** Raw HTML appended to every page head (e.g. CDN framework links). */
   head?: string;
   /** Global SEO defaults. */
@@ -216,7 +224,12 @@ function tenantIdentityFromConfig(
 function frameworkMiddleware(deps: RuntimeDeps): Middleware[] {
   const middleware: Middleware[] = [];
 
+  if (deps.security?.requestLimits) {
+    middleware.push(requestHardening(deps.security.requestLimits));
+  }
+
   if (deps.observability && deps.observability.enabled !== false) {
+    middleware.push(metricsMiddleware({ registry: defaultMetrics, includePath: false }));
     middleware.push(
       tracingMiddleware(undefined, {
         sampleRate: deps.observability.sampleRate,
@@ -855,6 +868,10 @@ export function createHandlers(deps: RuntimeDeps): Handlers {
   const pwaEnabled = deps.pwa !== false && deps.pwa?.enabled !== false;
   const pwaConfig: PwaConfig = deps.pwa && typeof deps.pwa === "object" ? deps.pwa : {};
   const pwaServiceWorkerEnabled = pwaEnabled && pwaConfig.serviceWorker !== false;
+  const webVitalsEnabled =
+    deps.observability?.enabled !== false && deps.observability?.webVitals === true;
+  const webVitalsEndpoint = deps.observability?.webVitalsEndpoint ?? "/__wrnexus/metrics/vitals";
+  const webVitalsHandler = createWebVitalsHandler({ registry: defaultMetrics });
 
   const configuredPermissions = deps.security?.permissionsPolicy;
   const runtimeSecurity: SecurityConfig | undefined =
@@ -883,6 +900,27 @@ export function createHandlers(deps: RuntimeDeps): Handlers {
     if (url.pathname === "/healthz" || url.pathname === "/__wrnexus/health") {
       return secure(Response.json({ status: "ok" }));
     }
+    if (webVitalsEnabled && url.pathname === webVitalsEndpoint) {
+      return secure(await webVitalsHandler(req));
+    }
+    if (webVitalsEnabled && url.pathname === "/__wrnexus/vitals.js") {
+      return secure(
+        new Response(
+          webVitalsClient({
+            endpoint: webVitalsEndpoint,
+            sampleRate: deps.observability?.sampleRate,
+          }),
+          {
+            headers: {
+              "content-type": "text/javascript; charset=utf-8",
+              "cache-control": url.searchParams.has("v")
+                ? "public, max-age=31536000, immutable"
+                : "no-cache",
+            },
+          },
+        ),
+      );
+    }
 
     if (url.pathname === "/site.webmanifest" && pwaEnabled) {
       const pwa = pwaConfig;
@@ -1455,6 +1493,9 @@ export function createHandlers(deps: RuntimeDeps): Handlers {
     const scripts = collectScripts(body, deps.clientRuntimes, deps.navigation).map((script) =>
       versionRenderScript(script, deps.assetVersion),
     );
+    if (webVitalsEnabled) {
+      scripts.push(versionAssetUrl("/__wrnexus/vitals.js", deps.assetVersion));
+    }
     if (pwaServiceWorkerEnabled)
       scripts.push(versionAssetUrl("/__wrnexus/pwa.js", deps.assetVersion));
     if (deps.mobile?.enabled !== false && usesMobileRuntime(body))
@@ -1653,8 +1694,10 @@ const COMPRESS_MIN_BYTES = 1024;
  * `Cache-Control: no-transform`, so they are never buffered here.
  */
 async function compressResponse(req: Request, res: Response): Promise<Response> {
-  const accept = req.headers.get("accept-encoding") ?? "";
-  if (!accept.toLowerCase().includes("gzip")) return res;
+  const accept = (req.headers.get("accept-encoding") ?? "").toLowerCase();
+  const acceptsBrotli = /(?:^|,)\s*br(?:\s*;|\s*,|$)/.test(accept);
+  const acceptsGzip = /(?:^|,)\s*gzip(?:\s*;|\s*,|$)/.test(accept);
+  if (!acceptsBrotli && !acceptsGzip) return res;
   if (res.headers.get("content-encoding")) return res;
   if (res.status === 204 || res.status === 304) return res;
   if (!COMPRESSIBLE_TYPE.test(res.headers.get("content-type") ?? "")) return res;
@@ -1668,14 +1711,34 @@ async function compressResponse(req: Request, res: Response): Promise<Response>
       headers: res.headers,
     });
   }
-  const gzipped = Bun.gzipSync(body);
+
+  let encoded: Uint8Array;
+  let encoding: "br" | "gzip";
+  if (acceptsBrotli) {
+    encoded = new Uint8Array(
+      brotliCompressSync(body, {
+        params: { [zlibConstants.BROTLI_PARAM_QUALITY]: 4 },
+      }),
+    );
+    encoding = "br";
+  } else {
+    encoded = Bun.gzipSync(body);
+    encoding = "gzip";
+  }
+
   const headers = new Headers(res.headers);
-  headers.set("content-encoding", "gzip");
-  headers.set("content-length", String(gzipped.length));
+  headers.set("content-encoding", encoding);
+  headers.set("content-length", String(encoded.length));
   const vary = headers.get("Vary");
   if (!vary) headers.set("Vary", "Accept-Encoding");
   else if (!/\baccept-encoding\b/i.test(vary)) headers.set("Vary", `${vary}, Accept-Encoding`);
-  return new Response(gzipped, { status: res.status, statusText: res.statusText, headers });
+  const responseBody = new ArrayBuffer(encoded.byteLength);
+  new Uint8Array(responseBody).set(encoded);
+  return new Response(responseBody, {
+    status: res.status,
+    statusText: res.statusText,
+    headers,
+  });
 }
 
 /** Opening tag of a component mount: captures tag, attrs, name, self-close. */
@@ -1842,11 +1905,9 @@ export function normalizeComponentName(name: string): string {
 export function collectScripts(
   body: string,
   clientRuntimes: readonly ClientRuntimeDefinition[] = [],
-  navigation: { mode?: "client" | "document" } = {},
+  navigation: { mode?: "auto" | "client" | "document" } = {},
 ): RenderScript[] {
-  // Client navigation is optional. In document mode, links retain native browser
-  // behavior and each route receives a fresh server-rendered HTML document.
-  const scripts: RenderScript[] = navigation.mode === "document" ? [] : ["/__wrnexus/nav.js"];
+  const scripts: RenderScript[] = [];
   if (/\bdata-scope=/.test(body) || /\bdata-wrnexus-csr=/.test(body)) {
     scripts.push("/__wrnexus/reactive.js");
   }
@@ -1877,6 +1938,15 @@ export function collectScripts(
   // `data-wrnexus-runtime="id"`; the corresponding package chunk is loaded
   // once, without requiring application-authored script tags or public copies.
   scripts.push(...runtimeScriptsForMarkup(body, clientRuntimes));
+
+  // `auto` is the performance-first default: a fully static page ships no
+  // framework JavaScript and its links use native document navigation. Routes
+  // that already need browser behavior also receive progressive navigation.
+  // `client` preserves the explicit always-on behavior; `document` disables it.
+  const mode = navigation.mode ?? "auto";
+  if (mode === "client" || (mode === "auto" && scripts.length > 0)) {
+    scripts.unshift("/__wrnexus/nav.js");
+  }
   return scripts;
 }