@webtypen/webframez-react 0.0.35 → 0.0.36

package/dist/http.js

@@ -11,6 +11,12 @@ import fs2 from "node:fs";
 import path3 from "node:path";
 import { fileURLToPath, pathToFileURL } from "node:url";
 import { spawn } from "node:child_process";
+import {
+  brotliCompressSync,
+  createBrotliCompress,
+  createGzip,
+  gzipSync
+} from "node:zlib";
 
 // src/server.ts
 import path from "node:path";
@@ -767,7 +773,77 @@ function parseSearchParams(query) {
 function createInitialHtmlErrorMarkup(message) {
   return `<main style="font-family:system-ui,sans-serif;padding:24px"><h1 style="margin:0 0 12px">500</h1><p style="margin:0">${message}</p></main>`;
 }
+function createClientAssetVersion(distRootDir) {
+  try {
+    const stat = fs2.statSync(path3.join(distRootDir, "client.js"));
+    return `${Math.floor(stat.mtimeMs)}-${stat.size}`;
+  } catch {
+    return "";
+  }
+}
+function appendAssetVersion(url, version) {
+  if (!version) {
+    return url;
+  }
+  const separator = url.includes("?") ? "&" : "?";
+  return `${url}${separator}v=${encodeURIComponent(version)}`;
+}
+function isWithinDirectory(filePath, directory) {
+  return filePath === directory || filePath.startsWith(`${directory}${path3.sep}`);
+}
+function isCompressibleAsset(ext) {
+  return [".js", ".mjs", ".json", ".css", ".svg", ".txt", ".html"].includes(ext);
+}
+function isHashedAssetPath(filePath) {
+  return /-[a-f0-9]{12,}\.[cm]?js$/i.test(path3.basename(filePath));
+}
+function setAssetContentType(res, ext) {
+  if (ext === ".js" || ext === ".mjs") {
+    res.setHeader("Content-Type", "text/javascript; charset=utf-8");
+  } else if (ext === ".json") {
+    res.setHeader("Content-Type", "application/json; charset=utf-8");
+  } else if (ext === ".css") {
+    res.setHeader("Content-Type", "text/css; charset=utf-8");
+  } else if (ext === ".svg") {
+    res.setHeader("Content-Type", "image/svg+xml; charset=utf-8");
+  }
+}
+function getPreferredContentEncoding(req, ext, fileSize) {
+  if (!isCompressibleAsset(ext) || fileSize < 1024) {
+    return "";
+  }
+  const acceptEncoding = String(req.headers["accept-encoding"] || "");
+  if (/\bbr\b/.test(acceptEncoding)) {
+    return "br";
+  }
+  if (/\bgzip\b/.test(acceptEncoding)) {
+    return "gzip";
+  }
+  return "";
+}
+function sendTextResponse(req, res, body, options) {
+  const bodyBuffer = Buffer.from(body);
+  const contentEncoding = options.compress === false ? "" : getPreferredContentEncoding(req, ".html", bodyBuffer.length);
+  res.statusCode = options.statusCode ?? 200;
+  res.setHeader("Content-Type", options.contentType);
+  if (options.cacheControl) {
+    res.setHeader("Cache-Control", options.cacheControl);
+  }
+  res.setHeader("Vary", "Accept-Encoding");
+  if (contentEncoding === "br") {
+    res.setHeader("Content-Encoding", "br");
+    res.end(brotliCompressSync(bodyBuffer));
+    return;
+  }
+  if (contentEncoding === "gzip") {
+    res.setHeader("Content-Encoding", "gzip");
+    res.end(gzipSync(bodyBuffer));
+    return;
+  }
+  res.end(bodyBuffer);
+}
 var INITIAL_HTML_WORKER_SCRIPT = `
+const fs = require("node:fs");
 const path = require("node:path");
 const Module = require("node:module");
 const { Readable, Writable } = require("node:stream");
@@ -817,11 +893,42 @@ const reactDomServer = require(path.join(path.dirname(reactDomPkg), "server.node
 globalThis.__webpack_chunk_load__ = function __webframezNoopChunkLoad() {
   return Promise.resolve();
 };
+function normalizeWebframezRequireCandidate(candidate) {
+  const stagingMarker = path.join(".webframez-build", "");
+  const appMarker = path.join("app", "");
+  const stagingIndex = candidate.indexOf(stagingMarker);
+  const appIndex = candidate.indexOf(appMarker, stagingIndex >= 0 ? stagingIndex : 0);
+  if (stagingIndex >= 0 && appIndex >= 0) {
+    const runtimeCandidate = path.resolve(process.cwd(), candidate.slice(appIndex));
+    if (fs.existsSync(runtimeCandidate)) {
+      return runtimeCandidate;
+    }
+  }
+
+  const frameworkDistDir = path.join("node_modules", "@webtypen", "webframez-react", "dist");
+  const shouldUseCjs =
+    candidate.includes(frameworkDistDir) &&
+    (candidate.endsWith(path.join("dist", "navigation.js")) ||
+      candidate.endsWith(path.join("dist", "route-slot.js")));
+
+  if (!shouldUseCjs) {
+    return candidate;
+  }
+
+  const cjsCandidate = candidate.slice(0, -3) + ".cjs";
+  return fs.existsSync(cjsCandidate) ? cjsCandidate : candidate;
+}
+
 globalThis.__webpack_require__ = function __webframezNodeRequire(id) {
   if (typeof id !== "string") {
     return require(id);
   }
 
+  const directRequireTarget = normalizeWebframezRequireCandidate(id);
+  if (directRequireTarget !== id) {
+    return require(directRequireTarget);
+  }
+
   if (id.startsWith("./")) {
     const relativeId = id.slice(2);
     const candidates = [
@@ -829,10 +936,16 @@ globalThis.__webpack_require__ = function __webframezNodeRequire(id) {
       path.resolve(process.cwd(), "..", relativeId)
     ];
     for (const candidate of candidates) {
+      const requireTarget = normalizeWebframezRequireCandidate(candidate);
       try {
-        return require(candidate);
+        return require(requireTarget);
       } catch (error) {
-        const missingCandidate = error && error.code === "MODULE_NOT_FOUND" && typeof error.message === "string" && error.message.includes("'" + candidate + "'");
+        const missingCandidate =
+          error &&
+          error.code === "MODULE_NOT_FOUND" &&
+          typeof error.message === "string" &&
+          (error.message.includes("'" + candidate + "'") ||
+            error.message.includes("'" + requireTarget + "'"));
         if (!missingCandidate) {
           throw error;
         }
@@ -1054,6 +1167,14 @@ function joinRuntimeBasePath(basePath, pathname) {
   }
   return normalizedPath === "/" ? basePath : `${basePath}${normalizedPath}`;
 }
+function joinRuntimeAssetPath(basePath, pathname) {
+  const normalizedBasePath = normalizeRuntimeBasePath(basePath) ?? "";
+  const normalizedPath = !pathname || pathname === "/" ? "/" : pathname.startsWith("/") ? pathname : `/${pathname}`;
+  if (normalizedBasePath && (normalizedPath === normalizedBasePath || normalizedPath.startsWith(`${normalizedBasePath}/`))) {
+    return normalizedPath;
+  }
+  return joinRuntimeBasePath(normalizedBasePath, normalizedPath);
+}
 function sanitizeInitialHtmlWorkerNodeOptions(rawNodeOptions) {
   if (!rawNodeOptions || rawNodeOptions.trim() === "") {
     return "";
@@ -1248,6 +1369,18 @@ function createServerConsumerManifest(manifest) {
   const consumerManifest = {};
   const normalizeWorkerModuleId = (requestKey, rawModuleId) => {
     if (typeof rawModuleId === "string" && rawModuleId.trim() !== "") {
+      const isStagingModuleId = rawModuleId.startsWith("./.webframez-build/") || rawModuleId.includes(`${path3.sep}.webframez-build${path3.sep}`);
+      const isRuntimeBuildKey = requestKey.startsWith("file://") || requestKey.startsWith("/") && requestKey.includes(`${path3.sep}build${path3.sep}app${path3.sep}`);
+      if (isStagingModuleId && isRuntimeBuildKey) {
+        if (requestKey.startsWith("file://")) {
+          try {
+            return fileURLToPath(requestKey);
+          } catch {
+            return rawModuleId;
+          }
+        }
+        return requestKey;
+      }
       return rawModuleId;
     }
     if (typeof rawModuleId !== "number" || !Number.isFinite(rawModuleId)) {
@@ -1329,6 +1462,14 @@ function createServerConsumerManifest(manifest) {
           name: exportName
         });
       }
+    } else if (typeof entry.id === "string" && entry.id.trim() !== "") {
+      addReference(entry.id, "*", reference);
+      for (const exportName of exportNames) {
+        addReference(entry.id, exportName, {
+          ...reference,
+          name: exportName
+        });
+      }
     }
   }
   return consumerManifest;
@@ -1443,24 +1584,49 @@ function createNodeRequestHandler(options) {
     if (url.pathname.startsWith(assetsPrefix)) {
       const relative = url.pathname.slice(assetsPrefix.length);
       const filePath = path3.resolve(distRootDir, relative);
-      if (!filePath.startsWith(distRootDir)) {
+      if (!isWithinDirectory(filePath, distRootDir)) {
         res.statusCode = 400;
         res.end("Invalid path");
         return;
       }
       const ext = path3.extname(filePath);
-      if (ext === ".js" || ext === ".mjs") {
-        res.setHeader("Content-Type", "text/javascript; charset=utf-8");
-      } else if (ext === ".json") {
-        res.setHeader("Content-Type", "application/json; charset=utf-8");
+      let stat;
+      try {
+        stat = fs2.statSync(filePath);
+        if (!stat.isFile()) {
+          throw new Error("Asset path is not a file");
+        }
+      } catch {
+        res.statusCode = 404;
+        res.end("Not found");
+        return;
       }
-      res.setHeader("Cache-Control", "no-store, no-cache, must-revalidate, proxy-revalidate");
+      setAssetContentType(res, ext);
+      const isDevelopmentAsset = nodeEnv !== "production";
+      const isVersionedClientAsset = path3.basename(filePath) === "client.js" && url.searchParams.has("v");
+      const canCacheLongTerm = !isDevelopmentAsset && (isHashedAssetPath(filePath) || isVersionedClientAsset);
+      res.setHeader(
+        "Cache-Control",
+        canCacheLongTerm ? "public, max-age=31536000, immutable" : "no-store, no-cache, must-revalidate, proxy-revalidate"
+      );
+      res.setHeader("Vary", "Accept-Encoding");
+      const contentEncoding = !isDevelopmentAsset ? getPreferredContentEncoding(req, ext, stat.size) : "";
       const stream = fs2.createReadStream(filePath);
       stream.on("error", () => {
-        res.statusCode = 404;
+        if (!res.headersSent) {
+          res.statusCode = 404;
+        }
         res.end("Not found");
       });
-      stream.pipe(res);
+      if (contentEncoding === "br") {
+        res.setHeader("Content-Encoding", "br");
+        stream.pipe(createBrotliCompress()).pipe(res);
+      } else if (contentEncoding === "gzip") {
+        res.setHeader("Content-Encoding", "gzip");
+        stream.pipe(createGzip()).pipe(res);
+      } else {
+        stream.pipe(res);
+      }
       return;
     }
     const resolved = await withRequestBasename(
@@ -1478,22 +1644,23 @@ function createNodeRequestHandler(options) {
     );
     const initialPayload = {
       model: resolved.model,
-      contextModel: resolved.contextModel,
-      pageModel: resolved.pageModel,
       head: resolved.head
     };
     const initialFlightData = await renderRSCToString(initialPayload, {
       moduleMap
     });
     const transportBasePath = normalizeRuntimeBasePath(resolved.head.transportBasePath) ?? normalizeRuntimeBasePath(basePath) ?? "";
-    const shellClientScriptUrl = joinRuntimeBasePath(
-      transportBasePath,
-      "/assets/client.js"
+    const shellClientScriptUrl = appendAssetVersion(
+      joinRuntimeAssetPath(
+        transportBasePath,
+        clientScriptUrl
+      ),
+      createClientAssetVersion(distRootDir)
     );
     const shellRscEndpoint = joinRuntimeBasePath(transportBasePath, "/rsc");
     const shellBasename = normalizeRuntimeBasePath(resolved.head.basename) ?? normalizeRuntimeBasePath(basePath) ?? "";
     const shellRouteBasePath = normalizeRuntimeBasePath(resolved.head.routeBasePath) ?? "";
-    let rootHtml = "";
+    let rootHtml;
     try {
       rootHtml = await initialHtmlWorker.renderFromFlightData({
         flightData: initialFlightData,
@@ -1517,29 +1684,23 @@ function createNodeRequestHandler(options) {
           });
         } catch (flightRenderError) {
           console.error("[webframez-react] Flight-to-HTML render failed", flightRenderError);
-          res.statusCode = 500;
-          res.setHeader("Content-Type", "text/html");
-          res.end(
-            createHTMLShell({
-              title: "500 - Initial HTML render failed",
-              headTags: "",
-              clientScriptUrl: shellClientScriptUrl,
-              rscEndpoint: shellRscEndpoint,
-              rootHtml: createInitialHtmlErrorMarkup("Initial HTML render failed."),
-              initialFlightData,
-              basename: shellBasename,
-              routeBasePath: shellRouteBasePath,
-              liveReloadPath: liveReloadPath || void 0,
-              liveReloadServerId: liveReloadPath ? devServerId : void 0
-            })
+          sendTextResponse(
+            req,
+            res,
+            createInitialHtmlErrorMarkup("Failed to render initial React HTML."),
+            {
+              statusCode: 500,
+              contentType: "text/html; charset=utf-8",
+              compress: nodeEnv === "production"
+            }
           );
           return;
         }
       }
     }
-    res.statusCode = resolved.statusCode;
-    res.setHeader("Content-Type", "text/html");
-    res.end(
+    sendTextResponse(
+      req,
+      res,
       createHTMLShell({
         title: resolved.head.title || "Webframez React",
         headTags: renderHeadToString(resolved.head),
@@ -1551,7 +1712,13 @@ function createNodeRequestHandler(options) {
         routeBasePath: shellRouteBasePath,
         liveReloadPath: liveReloadPath || void 0,
         liveReloadServerId: liveReloadPath ? devServerId : void 0
-      })
+      }),
+      {
+        statusCode: resolved.statusCode,
+        contentType: "text/html; charset=utf-8",
+        cacheControl: "no-store, no-cache, must-revalidate, proxy-revalidate",
+        compress: nodeEnv === "production"
+      }
     );
   };
 }