react-bun-ssr 0.1.0

package/framework/runtime/build-tools.ts

@@ -0,0 +1,234 @@
+import path from "node:path";
+import { createBunRouteAdapter } from "./bun-route-adapter";
+import {
+  ensureCleanDir,
+  ensureDir,
+  existsPath,
+  glob,
+  statPath,
+  writeTextIfChanged,
+} from "./io";
+import type {
+  BuildManifest,
+  BuildRouteAsset,
+  PageRouteDefinition,
+  ResolvedConfig,
+  RouteManifest,
+} from "./types";
+import { normalizeSlashes, stableHash, toImportPath } from "./utils";
+
+interface ClientEntryFile {
+  routeId: string;
+  entryFilePath: string;
+  route: PageRouteDefinition;
+}
+
+async function walkFiles(rootDir: string): Promise<string[]> {
+  if (!(await existsPath(rootDir))) {
+    return [];
+  }
+
+  return glob("**/*", { cwd: rootDir, absolute: true });
+}
+
+function buildClientEntrySource(options: {
+  generatedDir: string;
+  route: PageRouteDefinition;
+  rootModulePath: string;
+  runtimeClientFile: string;
+}): string {
+  const { generatedDir, route, rootModulePath, runtimeClientFile } = options;
+
+  const imports: string[] = [];
+
+  const runtimeImport = toImportPath(generatedDir, runtimeClientFile);
+  const rootImport = toImportPath(generatedDir, rootModulePath);
+  const routeImport = toImportPath(generatedDir, route.filePath);
+
+  imports.push(`import { hydrateRoute } from "${runtimeImport}";`);
+
+  imports.push(`import RootDefault from "${rootImport}";`);
+  imports.push(`import * as RootModule from "${rootImport}";`);
+
+  imports.push(`import RouteDefault from "${routeImport}";`);
+  imports.push(`import * as RouteModule from "${routeImport}";`);
+
+  const layoutModuleRefs: string[] = [];
+  for (let index = 0; index < route.layoutFiles.length; index += 1) {
+    const layoutFilePath = route.layoutFiles[index]!;
+    const layoutImportPath = toImportPath(generatedDir, layoutFilePath);
+    imports.push(`import Layout${index}Default from "${layoutImportPath}";`);
+    imports.push(`import * as Layout${index}Module from "${layoutImportPath}";`);
+    layoutModuleRefs.push(`{ ...Layout${index}Module, default: Layout${index}Default }`);
+  }
+
+  return `${imports.join("\n")}
+
+const modules = {
+  root: { ...RootModule, default: RootDefault },
+  layouts: [${layoutModuleRefs.join(", ")}],
+  route: { ...RouteModule, default: RouteDefault },
+};
+
+hydrateRoute(modules);
+`;
+}
+
+export async function generateClientEntries(options: {
+  config: ResolvedConfig;
+  manifest: RouteManifest;
+  generatedDir: string;
+}): Promise<ClientEntryFile[]> {
+  const { config, manifest, generatedDir } = options;
+  await ensureDir(generatedDir);
+
+  const runtimeClientFile = path.resolve(config.cwd, "framework/runtime/client-runtime.tsx");
+
+  return Promise.all(
+    manifest.pages.map(async route => {
+      const entryName = `route__${route.id}.tsx`;
+      const entryFilePath = path.join(generatedDir, entryName);
+      const source = buildClientEntrySource({
+        generatedDir,
+        route,
+        rootModulePath: config.rootModule,
+        runtimeClientFile,
+      });
+
+      await writeTextIfChanged(entryFilePath, source);
+
+      return {
+        routeId: route.id,
+        entryFilePath,
+        route,
+      };
+    }),
+  );
+}
+
+async function mapBuildOutputsByPrefix(options: {
+  outDir: string;
+  routeIds: string[];
+  publicPrefix: string;
+}): Promise<Record<string, BuildRouteAsset>> {
+  const { outDir, routeIds, publicPrefix } = options;
+  const files = (await walkFiles(outDir)).map(filePath => normalizeSlashes(path.relative(outDir, filePath)));
+
+  const routeAssets: Record<string, BuildRouteAsset> = {};
+
+  for (const routeId of routeIds) {
+    const base = `route__${routeId}`;
+    const script = files.find(file => file.startsWith(base) && file.endsWith(".js"));
+    const css = files.filter(file => file.startsWith(base) && file.endsWith(".css"));
+
+    if (!script) {
+      continue;
+    }
+
+    routeAssets[routeId] = {
+      script: `${publicPrefix}${script}`,
+      css: css.map(file => `${publicPrefix}${file}`),
+    };
+  }
+
+  return routeAssets;
+}
+
+export async function bundleClientEntries(options: {
+  entries: ClientEntryFile[];
+  outDir: string;
+  dev: boolean;
+  publicPrefix: string;
+}): Promise<Record<string, BuildRouteAsset>> {
+  const { entries, outDir, dev, publicPrefix } = options;
+
+  await ensureDir(outDir);
+  if (entries.length === 0) {
+    return {};
+  }
+
+  const result = await Bun.build({
+    entrypoints: entries.map(entry => entry.entryFilePath),
+    outdir: outDir,
+    target: "browser",
+    format: "esm",
+    splitting: false,
+    sourcemap: dev ? "inline" : "external",
+    minify: !dev,
+    naming: dev ? "[name].[ext]" : "[name]-[hash].[ext]",
+  });
+
+  if (!result.success) {
+    const messages = result.logs.map(log => log.message).join("\n");
+    throw new Error(`Client bundle failed:\n${messages}`);
+  }
+
+  return mapBuildOutputsByPrefix({
+    outDir,
+    routeIds: entries.map(entry => entry.routeId),
+    publicPrefix,
+  });
+}
+
+export async function ensureCleanDirectory(dirPath: string): Promise<void> {
+  await ensureCleanDir(dirPath);
+}
+
+export async function copyDirRecursive(sourceDir: string, destinationDir: string): Promise<void> {
+  if (!(await existsPath(sourceDir))) {
+    return;
+  }
+
+  await ensureDir(destinationDir);
+
+  const entries = await glob("**/*", { cwd: sourceDir });
+  await Promise.all(
+    entries.map(async entry => {
+      const from = path.join(sourceDir, entry);
+      const to = path.join(destinationDir, entry);
+      const fileStat = await statPath(from);
+      if (!fileStat?.isFile()) {
+        return;
+      }
+
+      await ensureDir(path.dirname(to));
+      await Bun.write(to, Bun.file(from));
+    }),
+  );
+}
+
+export function createBuildManifest(routeAssets: Record<string, BuildRouteAsset>): BuildManifest {
+  return {
+    version: stableHash(JSON.stringify(routeAssets)),
+    generatedAt: new Date().toISOString(),
+    routes: routeAssets,
+  };
+}
+
+export async function discoverFileSignature(rootDir: string): Promise<string> {
+  const files = (await walkFiles(rootDir))
+    .filter(file => !normalizeSlashes(file).includes("/node_modules/"))
+    .sort();
+
+  const signatureBits = (await Promise.all(
+    files.map(async filePath => {
+      const fileStat = await statPath(filePath);
+      if (!fileStat?.isFile()) {
+        return null;
+      }
+      const contentHash = stableHash(await Bun.file(filePath).bytes());
+      return `${normalizeSlashes(filePath)}:${contentHash}`;
+    }),
+  )).filter((value): value is string => Boolean(value));
+
+  return stableHash(signatureBits.join("|"));
+}
+
+export async function buildRouteManifest(config: ResolvedConfig): Promise<RouteManifest> {
+  const adapter = await createBunRouteAdapter({
+    routesDir: config.routesDir,
+    generatedMarkdownRootDir: path.resolve(config.cwd, ".rbssr/generated/markdown-routes"),
+    projectionRootDir: path.resolve(config.cwd, ".rbssr/generated/router-projection/build-manifest"),
+  });
+  return adapter.manifest;
+}

package/framework/runtime/bun-route-adapter.ts

@@ -0,0 +1,200 @@
+import path from "node:path";
+import { ensureCleanDir, ensureDir, writeTextIfChanged } from "./io";
+import { scanRoutes } from "./route-scanner";
+import type {
+  ApiRouteDefinition,
+  PageRouteDefinition,
+  Params,
+  RouteManifest,
+  RouteMatch,
+} from "./types";
+import { normalizeSlashes, toImportPath } from "./utils";
+
+const PAGE_STUB_EXT = ".tsx";
+const API_STUB_EXT = ".ts";
+const ROUTER_FILE_EXTENSIONS = [".tsx", ".jsx", ".ts", ".js"];
+
+export interface BunRouteAdapter {
+  manifest: RouteManifest;
+  matchPage(pathname: string): RouteMatch<PageRouteDefinition> | null;
+  matchApi(pathname: string): RouteMatch<ApiRouteDefinition> | null;
+}
+
+function toRouterRelativePath(routePath: string, extension: string): string {
+  if (routePath === "/") {
+    return `index${extension}`;
+  }
+
+  const parts = routePath
+    .replace(/^\/+/, "")
+    .split("/")
+    .filter(Boolean)
+    .map((segment) => {
+      if (segment.startsWith(":")) {
+        return `[${segment.slice(1)}]`;
+      }
+      if (segment.startsWith("*")) {
+        return `[...${segment.slice(1)}]`;
+      }
+      return segment;
+    });
+
+  return `${parts.join("/")}${extension}`;
+}
+
+function toPageStubSource(stubFilePath: string, routeFilePath: string): string {
+  const fromDir = path.dirname(stubFilePath);
+  const routeImportPath = toImportPath(fromDir, routeFilePath);
+  return `export { default } from "${routeImportPath}";
+export * from "${routeImportPath}";
+`;
+}
+
+function toApiStubSource(stubFilePath: string, routeFilePath: string): string {
+  const fromDir = path.dirname(stubFilePath);
+  const routeImportPath = toImportPath(fromDir, routeFilePath);
+  return `export * from "${routeImportPath}";
+`;
+}
+
+function normalizeParams(value: Record<string, string>): Params {
+  const params: Params = {};
+  for (const [key, paramValue] of Object.entries(value)) {
+    params[key] = String(paramValue);
+  }
+  return params;
+}
+
+function normalizeRouteKey(value: string): string {
+  return normalizeSlashes(value).replace(/^\/+/, "");
+}
+
+async function writeProjectionRoutes<T extends PageRouteDefinition | ApiRouteDefinition>(options: {
+  routes: T[];
+  outDir: string;
+  extension: string;
+  toSource: (stubFilePath: string, routeFilePath: string) => string;
+  routeTypeLabel: "page" | "api";
+}): Promise<Map<string, T>> {
+  const {
+    routes,
+    outDir,
+    extension,
+    toSource,
+    routeTypeLabel,
+  } = options;
+  await ensureDir(outDir);
+
+  const byProjectedFilePath = new Map<string, T>();
+  const collisionMap = new Map<string, T>();
+  const writes: Array<{ projectedFilePath: string; source: string }> = [];
+
+  for (const route of routes) {
+    const relativeFilePath = normalizeSlashes(toRouterRelativePath(route.routePath, extension));
+    const projectedFilePath = path.join(outDir, relativeFilePath);
+    const projectedKey = normalizeRouteKey(relativeFilePath);
+    const existing = collisionMap.get(projectedKey);
+
+    if (existing) {
+      throw new Error(
+        `Route projection collision for ${routeTypeLabel} routes: "${existing.filePath}" and "${route.filePath}" both map to "${relativeFilePath}"`,
+      );
+    }
+
+    collisionMap.set(projectedKey, route);
+    writes.push({
+      projectedFilePath,
+      source: toSource(projectedFilePath, route.filePath),
+    });
+    byProjectedFilePath.set(projectedKey, route);
+  }
+
+  await Promise.all(
+    writes.map(async ({ projectedFilePath, source }) => {
+      await ensureDir(path.dirname(projectedFilePath));
+      await writeTextIfChanged(projectedFilePath, source);
+    }),
+  );
+
+  return byProjectedFilePath;
+}
+
+function toRouteMatch<T extends PageRouteDefinition | ApiRouteDefinition>(
+  routeByProjectedPath: Map<string, T>,
+  pathname: string,
+  router: Bun.FileSystemRouter,
+): RouteMatch<T> | null {
+  const matched = router.match(pathname);
+  if (!matched) {
+    return null;
+  }
+
+  const matchedSource = normalizeRouteKey(
+    ((matched as { src?: string; scriptSrc?: string }).src
+      ?? (matched as { src?: string; scriptSrc?: string }).scriptSrc
+      ?? ""),
+  );
+  const route = routeByProjectedPath.get(matchedSource);
+  if (!route) {
+    return null;
+  }
+
+  return {
+    route,
+    params: normalizeParams(matched.params),
+  };
+}
+
+export async function createBunRouteAdapter(options: {
+  routesDir: string;
+  generatedMarkdownRootDir: string;
+  projectionRootDir: string;
+}): Promise<BunRouteAdapter> {
+  const manifest = await scanRoutes(options.routesDir, {
+    generatedMarkdownRootDir: options.generatedMarkdownRootDir,
+  });
+
+  await ensureCleanDir(options.projectionRootDir);
+
+  const pagesProjectionDir = path.join(options.projectionRootDir, "pages");
+  const apiProjectionDir = path.join(options.projectionRootDir, "api");
+
+  const [pageRouteByProjectedPath, apiRouteByProjectedPath] = await Promise.all([
+    writeProjectionRoutes({
+      routes: manifest.pages,
+      outDir: pagesProjectionDir,
+      extension: PAGE_STUB_EXT,
+      toSource: toPageStubSource,
+      routeTypeLabel: "page",
+    }),
+    writeProjectionRoutes({
+      routes: manifest.api,
+      outDir: apiProjectionDir,
+      extension: API_STUB_EXT,
+      toSource: toApiStubSource,
+      routeTypeLabel: "api",
+    }),
+  ]);
+
+  const pageRouter = new Bun.FileSystemRouter({
+    style: "nextjs",
+    dir: pagesProjectionDir,
+    fileExtensions: ROUTER_FILE_EXTENSIONS,
+  });
+
+  const apiRouter = new Bun.FileSystemRouter({
+    style: "nextjs",
+    dir: apiProjectionDir,
+    fileExtensions: ROUTER_FILE_EXTENSIONS,
+  });
+
+  return {
+    manifest,
+    matchPage(pathname) {
+      return toRouteMatch(pageRouteByProjectedPath, pathname, pageRouter);
+    },
+    matchApi(pathname) {
+      return toRouteMatch(apiRouteByProjectedPath, pathname, apiRouter);
+    },
+  };
+}

package/framework/runtime/client-runtime.tsx

@@ -0,0 +1,62 @@
+import { hydrateRoot } from "react-dom/client";
+import { isDeferredToken } from "./deferred";
+import type { RouteModuleBundle, RenderPayload } from "./types";
+import { createRouteTree } from "./tree";
+
+interface DeferredClientRuntime {
+  get(id: string): Promise<unknown>;
+}
+
+declare global {
+  interface Window {
+    __RBSSR_DEFERRED__?: DeferredClientRuntime;
+  }
+}
+
+function reviveDeferredPayload(payload: RenderPayload): RenderPayload {
+  const sourceData = payload.data;
+  if (!sourceData || Array.isArray(sourceData) || typeof sourceData !== "object") {
+    return payload;
+  }
+
+  const runtime = window.__RBSSR_DEFERRED__;
+  if (!runtime) {
+    return payload;
+  }
+
+  const revivedData = { ...(sourceData as Record<string, unknown>) };
+  for (const [key, value] of Object.entries(revivedData)) {
+    if (!isDeferredToken(value)) {
+      continue;
+    }
+    revivedData[key] = runtime.get(value.__rbssrDeferred);
+  }
+
+  return {
+    ...payload,
+    data: revivedData,
+  };
+}
+
+function getPayload(): RenderPayload {
+  const script = document.getElementById("__RBSSR_PAYLOAD__");
+  if (!script) {
+    throw new Error("Missing SSR payload script tag");
+  }
+
+  const raw = script.textContent ?? "{}";
+  const parsed = JSON.parse(raw) as RenderPayload;
+  return reviveDeferredPayload(parsed);
+}
+
+export function hydrateRoute(modules: RouteModuleBundle): void {
+  const payload = getPayload();
+  const container = document.getElementById("rbssr-root");
+  if (!container) {
+    throw new Error("Missing #rbssr-root hydration container");
+  }
+
+  const Leaf = modules.route.default;
+  const tree = createRouteTree(modules, <Leaf />, payload);
+  hydrateRoot(container, tree);
+}

package/framework/runtime/config.ts

@@ -0,0 +1,142 @@
+import path from "node:path";
+import { existsPath } from "./io";
+import type { FrameworkConfig, ResolvedConfig, ResolvedResponseHeaderRule } from "./types";
+import { normalizeSlashes, toFileImportUrl } from "./utils";
+
+function escapeRegex(value: string): string {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+
+function globToRegExp(source: string): RegExp {
+  if (source.endsWith("/**")) {
+    const prefix = source.slice(0, -3);
+    return new RegExp(`^${escapeRegex(prefix)}(?:/.*)?$`);
+  }
+
+  let pattern = "^";
+
+  for (let index = 0; index < source.length; index += 1) {
+    const current = source[index]!;
+    const next = source[index + 1];
+
+    if (current === "*" && next === "*") {
+      pattern += ".*";
+      index += 1;
+      continue;
+    }
+
+    if (current === "*") {
+      pattern += "[^/]*";
+      continue;
+    }
+
+    pattern += escapeRegex(current);
+  }
+
+  pattern += "$";
+  return new RegExp(pattern);
+}
+
+function toHeaderRules(config: FrameworkConfig): ResolvedResponseHeaderRule[] {
+  if (config.headers === undefined) {
+    return [];
+  }
+
+  if (!Array.isArray(config.headers)) {
+    throw new Error("[rbssr config] `headers` must be an array.");
+  }
+
+  return config.headers.map((rule, index) => {
+    if (!rule || typeof rule !== "object") {
+      throw new Error(`[rbssr config] \`headers[${index}]\` must be an object.`);
+    }
+
+    const rawSource = rule.source;
+    if (typeof rawSource !== "string" || rawSource.trim().length === 0) {
+      throw new Error(`[rbssr config] \`headers[${index}].source\` must be a non-empty string.`);
+    }
+
+    const source = normalizeSlashes(rawSource.trim());
+    if (!source.startsWith("/")) {
+      throw new Error(`[rbssr config] \`headers[${index}].source\` must start with '/'.`);
+    }
+
+    const rawHeaders = rule.headers;
+    if (!rawHeaders || typeof rawHeaders !== "object" || Array.isArray(rawHeaders)) {
+      throw new Error(`[rbssr config] \`headers[${index}].headers\` must be an object.`);
+    }
+
+    const entries = Object.entries(rawHeaders);
+    if (entries.length === 0) {
+      throw new Error(`[rbssr config] \`headers[${index}].headers\` must include at least one header.`);
+    }
+
+    const headers: Record<string, string> = {};
+    for (const [key, value] of entries) {
+      if (typeof key !== "string" || key.trim().length === 0) {
+        throw new Error(`[rbssr config] \`headers[${index}].headers\` contains an empty header name.`);
+      }
+
+      if (typeof value !== "string" || value.trim().length === 0) {
+        throw new Error(
+          `[rbssr config] \`headers[${index}].headers.${key}\` must be a non-empty string value.`,
+        );
+      }
+
+      headers[key] = value;
+    }
+
+    return {
+      source,
+      headers,
+      matcher: globToRegExp(source),
+    };
+  });
+}
+
+export function resolveConfig(config: FrameworkConfig = {}, cwd = process.cwd()): ResolvedConfig {
+  const appDir = path.resolve(cwd, config.appDir ?? "app");
+  const routesDir = path.resolve(appDir, config.routesDir ?? "routes");
+  const publicDir = path.resolve(appDir, config.publicDir ?? "public");
+  const rootModule = path.resolve(appDir, config.rootModule ?? "root.tsx");
+  const middlewareFile = path.resolve(appDir, config.middlewareFile ?? "middleware.ts");
+  const distDir = path.resolve(cwd, config.distDir ?? "dist");
+  const headerRules = toHeaderRules(config);
+
+  return {
+    cwd,
+    appDir,
+    routesDir,
+    publicDir,
+    rootModule,
+    middlewareFile,
+    distDir,
+    host: config.host ?? "0.0.0.0",
+    port: config.port ?? 3000,
+    mode: config.mode ?? (process.env.NODE_ENV === "production" ? "production" : "development"),
+    headerRules,
+  };
+}
+
+export async function loadUserConfig(cwd = process.cwd()): Promise<FrameworkConfig> {
+  const candidates = [
+    path.resolve(cwd, "rbssr.config.ts"),
+    path.resolve(cwd, "rbssr.config.js"),
+    path.resolve(cwd, "rbssr.config.mjs"),
+  ];
+
+  let filePath: string | undefined;
+  for (const candidate of candidates) {
+    if (await existsPath(candidate)) {
+      filePath = candidate;
+      break;
+    }
+  }
+
+  if (!filePath) {
+    return {};
+  }
+
+  const imported = await import(toFileImportUrl(filePath));
+  return (imported.default ?? imported.config ?? {}) as FrameworkConfig;
+}