@chidchanun/bcp 0.1.0

package/packages/bundler/src/client-islands.ts

@@ -0,0 +1,1457 @@
+import fs from "node:fs";
+import path from "node:path";
+import {
+    brotliCompressSync,
+    constants,
+    gzipSync,
+} from "node:zlib";
+
+import {
+    build,
+    type Metafile,
+} from "esbuild";
+
+import {
+    createClientEnvironmentDefines,
+} from "../../env/src/index.js";
+
+import type {
+    ProductionAssetInfo,
+    ProductionAssetSize,
+    ProductionBuildManifest,
+} from "./production.js";
+
+export type IslandHydrationStrategy =
+    | "load"
+    | "idle"
+    | "visible"
+    | "media";
+
+export type IslandPrefetchStrategy =
+    | "none"
+    | "idle"
+    | "visible"
+    | "interaction";
+
+export interface ProductionIslandAsset {
+    entry: string;
+    imports: string[];
+    size: ProductionAssetSize;
+    hydrate: IslandHydrationStrategy;
+    media: string | null;
+    prefetch: IslandPrefetchStrategy;
+    preload: boolean;
+}
+
+interface IslandSource {
+    id: string;
+    filePath: string;
+    hydrate: IslandHydrationStrategy;
+    media: string | null;
+    prefetch: IslandPrefetchStrategy;
+    preload: boolean;
+}
+
+interface OutputNode {
+    absolutePath: string;
+    publicPath: string;
+    metadata:
+        Metafile["outputs"][string];
+}
+
+const PRECOMPRESS_MIN_BYTES =
+    1024;
+
+export async function buildClientIslands(
+    manifest: ProductionBuildManifest,
+    rootDirectory: string
+): Promise<
+    Record<string, ProductionIslandAsset>
+> {
+    const appDirectory =
+        path.join(
+            rootDirectory,
+            "app"
+        );
+
+    const islands =
+        discoverIslandSources(
+            appDirectory
+        );
+
+    if (islands.length === 0) {
+        return {};
+    }
+
+    const buildRoot =
+        path.join(
+            rootDirectory,
+            ".bcp-framework",
+            "build"
+        );
+
+    const clientDirectory =
+        path.join(
+            buildRoot,
+            "client"
+        );
+
+    const entryDirectory =
+        path.join(
+            buildRoot,
+            ".island-entries"
+        );
+
+    fs.rmSync(
+        entryDirectory,
+        {
+            recursive: true,
+            force: true,
+        }
+    );
+
+    fs.mkdirSync(
+        entryDirectory,
+        {
+            recursive: true,
+        }
+    );
+
+    const runtimeFile =
+        path.join(
+            entryDirectory,
+            "island-runtime.mjs"
+        );
+
+    fs.writeFileSync(
+        runtimeFile,
+        createSharedIslandRuntimeModule(),
+        "utf8"
+    );
+
+    const entryPoints:
+        Record<string, string> = {};
+
+    const entryToIsland =
+        new Map<string, string>();
+
+    for (const island of islands) {
+        const entryName =
+            sanitizeName(
+                island.id
+            );
+
+        const entryFile =
+            path.join(
+                entryDirectory,
+                `${entryName}.mjs`
+            );
+
+        const payloadFile =
+            path.join(
+                entryDirectory,
+                `${entryName}-payload.mjs`
+            );
+
+        fs.writeFileSync(
+            payloadFile,
+            createIslandPayloadModule(
+                island,
+                entryDirectory
+            ),
+            "utf8"
+        );
+
+        fs.writeFileSync(
+            entryFile,
+            createIslandSchedulerEntry(
+                island,
+                entryFile,
+                payloadFile,
+                runtimeFile
+            ),
+            "utf8"
+        );
+
+        entryPoints[
+            entryName
+        ] =
+            entryFile;
+
+        entryToIsland.set(
+            normalizePath(
+                entryFile
+            ),
+            island.id
+        );
+    }
+
+    const result =
+        await build({
+            absWorkingDir:
+                rootDirectory,
+            entryPoints,
+            outdir:
+                clientDirectory,
+            bundle:
+                true,
+            splitting:
+                true,
+            format:
+                "esm",
+            platform:
+                "browser",
+            target: [
+                "es2022",
+            ],
+            minify:
+                true,
+            treeShaking:
+                true,
+            sourcemap:
+                false,
+            metafile:
+                true,
+            jsx:
+                "automatic",
+            entryNames:
+                "islands/[name]-[hash]",
+            chunkNames:
+                "island-chunks/[name]-[hash]",
+            assetNames:
+                "island-assets/[name]-[hash]",
+            define:
+                createClientEnvironmentDefines(
+                    "production"
+                ),
+            legalComments:
+                "none",
+            logLevel:
+                "silent",
+        });
+
+    if (!result.metafile) {
+        throw new Error(
+            "BCP Framework: esbuild did not return client island metadata."
+        );
+    }
+
+    const outputNodes =
+        createOutputNodeMap(
+            result.metafile,
+            rootDirectory,
+            clientDirectory
+        );
+
+    const assetInfoByPath =
+        new Map<
+            string,
+            ProductionAssetInfo
+        >();
+
+    for (const node of outputNodes.values()) {
+        const assetInfo =
+            precompressOutput(
+                node.absolutePath,
+                node.publicPath
+            );
+
+        assetInfoByPath.set(
+            node.publicPath,
+            assetInfo
+        );
+    }
+
+    const islandById =
+        new Map(
+            islands.map(
+                (island) => [
+                    island.id,
+                    island,
+                ]
+            )
+        );
+
+    const islandManifest:
+        Record<
+            string,
+            ProductionIslandAsset
+        > = {};
+
+    for (const node of outputNodes.values()) {
+        if (!node.metadata.entryPoint) {
+            continue;
+        }
+
+        const absoluteEntry =
+            path.isAbsolute(
+                node.metadata.entryPoint
+            )
+                ? node.metadata.entryPoint
+                : path.resolve(
+                    rootDirectory,
+                    node.metadata.entryPoint
+                );
+
+        const islandId =
+            entryToIsland.get(
+                normalizePath(
+                    absoluteEntry
+                )
+            );
+
+        if (!islandId) {
+            continue;
+        }
+
+        const island =
+            islandById.get(
+                islandId
+            );
+
+        if (!island) {
+            continue;
+        }
+
+        const dependencies =
+            collectOutputImports(
+                node,
+                outputNodes,
+                rootDirectory
+            );
+
+        islandManifest[
+            islandId
+        ] = {
+            entry:
+                node.publicPath,
+            imports:
+                island.preload
+                    ? dependencies
+                    : [],
+            size:
+                sumAssetSizes(
+                    [
+                        node.publicPath,
+                        ...dependencies,
+                    ],
+                    assetInfoByPath
+                ),
+            hydrate:
+                island.hydrate,
+            media:
+                island.media,
+            prefetch:
+                island.prefetch,
+            preload:
+                island.preload,
+        };
+    }
+
+    for (const island of islands) {
+        if (
+            !islandManifest[
+                island.id
+            ]
+        ) {
+            throw new Error(
+                `BCP Framework: client island output was not found for "${island.id}".`
+            );
+        }
+    }
+
+    const existingAssets =
+        new Set(
+            manifest.assets.map(
+                (asset) =>
+                    asset.path
+            )
+        );
+
+    for (const asset of assetInfoByPath.values()) {
+        if (
+            existingAssets.has(
+                asset.path
+            )
+        ) {
+            continue;
+        }
+
+        manifest.assets.push(
+            asset
+        );
+    }
+
+    manifest.assets.sort(
+        (left, right) =>
+            left.path.localeCompare(
+                right.path
+            )
+    );
+
+    fs.rmSync(
+        entryDirectory,
+        {
+            recursive: true,
+            force: true,
+        }
+    );
+
+    return islandManifest;
+}
+
+function discoverIslandSources(
+    appDirectory: string
+): IslandSource[] {
+    if (
+        !fs.existsSync(
+            appDirectory
+        )
+    ) {
+        return [];
+    }
+
+    const islands:
+        IslandSource[] = [];
+
+    const seenIds =
+        new Map<string, string>();
+
+    walkDirectory(
+        appDirectory,
+        (filePath) => {
+            if (
+                !/\.island\.(?:ts|tsx)$/.test(
+                    filePath
+                )
+            ) {
+                return;
+            }
+
+            const source =
+                fs.readFileSync(
+                    filePath,
+                    "utf8"
+                );
+
+            const island =
+                parseIslandSource(
+                    source,
+                    filePath
+                );
+
+            const duplicate =
+                seenIds.get(
+                    island.id
+                );
+
+            if (duplicate) {
+                throw new Error(
+                    `BCP Framework: duplicate island id "${island.id}" in "${duplicate}" and "${filePath}".`
+                );
+            }
+
+            seenIds.set(
+                island.id,
+                filePath
+            );
+
+            islands.push(
+                island
+            );
+        }
+    );
+
+    return islands.sort(
+        (left, right) =>
+            left.id.localeCompare(
+                right.id
+            )
+    );
+}
+
+function parseIslandSource(
+    source: string,
+    filePath: string
+): IslandSource {
+    const match =
+        /\bcreateIsland(?:\s*<[^>]+>)?\s*\(\s*["']([A-Za-z][A-Za-z0-9._-]*)["']\s*,/.exec(
+            source
+        );
+
+    if (!match) {
+        throw new Error(
+            `BCP Framework: island file "${filePath}" must export createIsland("literal-id", Component).`
+        );
+    }
+
+    const id =
+        match[1];
+
+    const configurationSource =
+        source.slice(
+            match.index
+        );
+
+    const hydrateMatch =
+        /\bhydrate\s*:\s*["']([^"']+)["']/.exec(
+            configurationSource
+        );
+
+    const rawHydrate =
+        hydrateMatch?.[1] ??
+        "load";
+
+    if (
+        rawHydrate !== "load" &&
+        rawHydrate !== "idle" &&
+        rawHydrate !== "visible" &&
+        rawHydrate !== "media"
+    ) {
+        throw new Error(
+            `BCP Framework: island "${id}" in "${filePath}" has invalid hydrate strategy "${rawHydrate}".`
+        );
+    }
+
+    const hydrate =
+        rawHydrate as
+        IslandHydrationStrategy;
+
+    const mediaMatch =
+        /\bmedia\s*:\s*(["'])(.*?)\1/.exec(
+            configurationSource
+        );
+
+    const media =
+        mediaMatch?.[2]?.trim() ??
+        "";
+
+    if (
+        hydrate === "media" &&
+        !media
+    ) {
+        throw new Error(
+            `BCP Framework: island "${id}" in "${filePath}" uses hydrate: "media" and requires a literal media query.`
+        );
+    }
+
+    if (
+        hydrate !== "media" &&
+        media
+    ) {
+        throw new Error(
+            `BCP Framework: island "${id}" in "${filePath}" defines media but hydrate is "${hydrate}".`
+        );
+    }
+
+    const prefetchMatch =
+        /\bprefetch\s*:\s*["']([^"']+)["']/.exec(
+            configurationSource
+        );
+
+    const rawPrefetch =
+        prefetchMatch?.[1] ??
+        "none";
+
+    if (
+        rawPrefetch !== "none" &&
+        rawPrefetch !== "idle" &&
+        rawPrefetch !== "visible" &&
+        rawPrefetch !== "interaction"
+    ) {
+        throw new Error(
+            `BCP Framework: island "${id}" in "${filePath}" has invalid prefetch strategy "${rawPrefetch}".`
+        );
+    }
+
+    const preloadProperty =
+        /\bpreload\s*:/.test(
+            configurationSource
+        );
+
+    const preloadMatch =
+        /\bpreload\s*:\s*(true|false)\b/.exec(
+            configurationSource
+        );
+
+    if (
+        preloadProperty &&
+        !preloadMatch
+    ) {
+        throw new Error(
+            `BCP Framework: island "${id}" in "${filePath}" requires preload to be a literal boolean.`
+        );
+    }
+
+    return {
+        id,
+        filePath,
+        hydrate,
+        media:
+            hydrate === "media"
+                ? media
+                : null,
+        prefetch:
+            rawPrefetch as
+            IslandPrefetchStrategy,
+        preload:
+            preloadMatch
+                ? preloadMatch[1] ===
+                    "true"
+                : hydrate === "load",
+    };
+}
+
+function walkDirectory(
+    directory: string,
+    callback: (
+        filePath: string
+    ) => void
+): void {
+    for (
+        const entry
+        of fs.readdirSync(
+            directory,
+            {
+                withFileTypes: true,
+            }
+        )
+    ) {
+        const fullPath =
+            path.join(
+                directory,
+                entry.name
+            );
+
+        if (entry.isDirectory()) {
+            walkDirectory(
+                fullPath,
+                callback
+            );
+            continue;
+        }
+
+        if (entry.isFile()) {
+            callback(
+                fullPath
+            );
+        }
+    }
+}
+
+function createIslandPayloadModule(
+    island: IslandSource,
+    entryDirectory: string
+): string {
+    const islandImport =
+        toImportSpecifier(
+            entryDirectory,
+            island.filePath
+        );
+
+    return `
+import {
+  createElement
+} from "react";
+
+import {
+  hydrateRoot
+} from "react-dom/client";
+
+import Island from ${JSON.stringify(
+        islandImport
+    )};
+
+const metadata =
+  Island.__BCP_ISLAND__;
+
+if (
+  !metadata ||
+  metadata.id !== ${JSON.stringify(
+        island.id
+    )}
+) {
+  throw new Error(
+    "BCP Framework: invalid client island metadata for ${escapeJavaScriptString(
+        island.id
+    )}."
+  );
+}
+
+export function hydrateTargets(
+  elements
+) {
+  for (
+    const element
+    of elements
+  ) {
+    if (
+      element.getAttribute(
+        "data-bcp-island-hydrated"
+      ) === "true"
+    ) {
+      continue;
+    }
+
+    const serializedProps =
+      element.getAttribute(
+        "data-bcp-island-props"
+      ) ||
+      "{}";
+
+    const props =
+      JSON.parse(
+        serializedProps
+      );
+
+    hydrateRoot(
+      element,
+      createElement(
+        metadata.component,
+        props
+      )
+    );
+
+    element.setAttribute(
+      "data-bcp-island-hydrated",
+      "true"
+    );
+  }
+}
+    `.trim();
+}
+
+function createIslandSchedulerEntry(
+    island: IslandSource,
+    entryFile: string,
+    payloadFile: string,
+    runtimeFile: string
+): string {
+    const entryDirectory =
+        path.dirname(
+            entryFile
+        );
+
+    const payloadImport =
+        toImportSpecifier(
+            entryDirectory,
+            payloadFile
+        );
+
+    const runtimeImport =
+        toImportSpecifier(
+            entryDirectory,
+            runtimeFile
+        );
+
+    return `
+import {
+  scheduleIsland
+} from ${JSON.stringify(
+        runtimeImport
+    )};
+
+scheduleIsland(
+  {
+    id: ${JSON.stringify(island.id)},
+    hydrate: ${JSON.stringify(island.hydrate)},
+    media: ${JSON.stringify(island.media)},
+    prefetch: ${JSON.stringify(island.prefetch)}
+  },
+  () => import(${JSON.stringify(
+        payloadImport
+    )})
+);
+    `.trim();
+}
+
+function createSharedIslandRuntimeModule(): string {
+    return `
+export function scheduleIsland(
+  options,
+  importPayload
+) {
+  const {
+    id,
+    hydrate,
+    media,
+    prefetch
+  } = options;
+
+  let payloadPromise;
+
+  function getTargets() {
+    return Array.from(
+      document.querySelectorAll(
+        '[data-bcp-island="' +
+          escapeSelectorValue(id) +
+          '"]'
+      )
+    );
+  }
+
+  function loadPayload() {
+    if (!payloadPromise) {
+      payloadPromise =
+        importPayload();
+    }
+
+    return payloadPromise;
+  }
+
+  function prefetchIsland() {
+    void loadPayload()
+      .catch(
+        (error) => {
+          console.error(
+            "[BCP Island] " +
+              id +
+              " prefetch failed:",
+            error
+          );
+        }
+      );
+  }
+
+  async function hydrateIsland() {
+    const payload =
+      await loadPayload();
+
+    if (
+      !payload ||
+      typeof payload.hydrateTargets !==
+        "function"
+    ) {
+      throw new Error(
+        'BCP Framework: island "' +
+          id +
+          '" payload is missing hydrateTargets().'
+      );
+    }
+
+    payload.hydrateTargets(
+      getTargets()
+    );
+  }
+
+  function runHydration() {
+    void hydrateIsland()
+      .catch(
+        (error) => {
+          console.error(
+            "[BCP Island] " +
+              id +
+              " hydration failed:",
+            error
+          );
+        }
+      );
+  }
+
+  schedulePrefetch(
+    prefetch,
+    getTargets,
+    prefetchIsland
+  );
+
+  scheduleHydration(
+    hydrate,
+    media,
+    getTargets,
+    runHydration
+  );
+}
+
+function schedulePrefetch(
+  strategy,
+  getTargets,
+  prefetchIsland
+) {
+  if (strategy === "idle") {
+    if (
+      "requestIdleCallback" in window
+    ) {
+      window.requestIdleCallback(
+        prefetchIsland,
+        { timeout: 1500 }
+      );
+    } else {
+      window.setTimeout(
+        prefetchIsland,
+        50
+      );
+    }
+
+    return;
+  }
+
+  if (strategy === "visible") {
+    const targets =
+      getTargets();
+
+    if (
+      targets.length === 0 ||
+      !("IntersectionObserver" in window)
+    ) {
+      return;
+    }
+
+    const observer =
+      new IntersectionObserver(
+        (entries) => {
+          if (
+            !entries.some(
+              (entry) =>
+                entry.isIntersecting
+            )
+          ) {
+            return;
+          }
+
+          observer.disconnect();
+          prefetchIsland();
+        },
+        {
+          rootMargin:
+            "800px 0px"
+        }
+      );
+
+    for (const target of targets) {
+      observer.observe(target);
+    }
+
+    return;
+  }
+
+  if (strategy === "interaction") {
+    for (const target of getTargets()) {
+      let prefetched = false;
+
+      const onInteraction =
+        () => {
+          if (prefetched) {
+            return;
+          }
+
+          prefetched = true;
+
+          target.removeEventListener(
+            "pointerenter",
+            onInteraction
+          );
+          target.removeEventListener(
+            "focusin",
+            onInteraction
+          );
+          target.removeEventListener(
+            "touchstart",
+            onInteraction
+          );
+
+          prefetchIsland();
+        };
+
+      target.addEventListener(
+        "pointerenter",
+        onInteraction,
+        { passive: true }
+      );
+      target.addEventListener(
+        "focusin",
+        onInteraction
+      );
+      target.addEventListener(
+        "touchstart",
+        onInteraction,
+        { passive: true }
+      );
+    }
+  }
+}
+
+function scheduleHydration(
+  strategy,
+  mediaQuery,
+  getTargets,
+  runHydration
+) {
+  if (strategy === "idle") {
+    if (
+      "requestIdleCallback" in window
+    ) {
+      window.requestIdleCallback(
+        runHydration,
+        { timeout: 2000 }
+      );
+    } else {
+      window.setTimeout(
+        runHydration,
+        1
+      );
+    }
+
+    return;
+  }
+
+  if (strategy === "visible") {
+    const targets =
+      getTargets();
+
+    if (targets.length === 0) {
+      return;
+    }
+
+    if (
+      !("IntersectionObserver" in window)
+    ) {
+      runHydration();
+      return;
+    }
+
+    const observer =
+      new IntersectionObserver(
+        (entries) => {
+          if (
+            !entries.some(
+              (entry) =>
+                entry.isIntersecting
+            )
+          ) {
+            return;
+          }
+
+          observer.disconnect();
+          runHydration();
+        },
+        {
+          rootMargin:
+            "200px 0px"
+        }
+      );
+
+    for (const target of targets) {
+      observer.observe(target);
+    }
+
+    return;
+  }
+
+  if (strategy === "media") {
+    if (
+      !("matchMedia" in window)
+    ) {
+      runHydration();
+      return;
+    }
+
+    const media =
+      window.matchMedia(
+        mediaQuery
+      );
+
+    if (media.matches) {
+      runHydration();
+      return;
+    }
+
+    const onChange =
+      (event) => {
+        if (!event.matches) {
+          return;
+        }
+
+        media.removeEventListener(
+          "change",
+          onChange
+        );
+        runHydration();
+      };
+
+    media.addEventListener(
+      "change",
+      onChange
+    );
+
+    return;
+  }
+
+  runHydration();
+}
+
+function escapeSelectorValue(
+  value
+) {
+  if (
+    globalThis.CSS &&
+    typeof globalThis.CSS.escape ===
+      "function"
+  ) {
+    return globalThis.CSS.escape(
+      value
+    );
+  }
+
+  return String(value)
+    .replaceAll(
+      "\\\\",
+      "\\\\\\\\"
+    )
+    .replaceAll(
+      '"',
+      '\\\\"'
+    );
+}
+    `.trim();
+}
+
+function createOutputNodeMap(
+    metafile: Metafile,
+    rootDirectory: string,
+    clientDirectory: string
+): Map<string, OutputNode> {
+    const nodes =
+        new Map<string, OutputNode>();
+
+    for (
+        const [
+            outputName,
+            metadata,
+        ]
+        of Object.entries(
+            metafile.outputs
+        )
+    ) {
+        const absolutePath =
+            path.isAbsolute(
+                outputName
+            )
+                ? outputName
+                : path.resolve(
+                    rootDirectory,
+                    outputName
+                );
+
+        const relativePath =
+            path.relative(
+                clientDirectory,
+                absolutePath
+            );
+
+        if (
+            relativePath.startsWith(
+                ".."
+            ) ||
+            path.isAbsolute(
+                relativePath
+            )
+        ) {
+            continue;
+        }
+
+        const publicPath =
+            `/_bcp/client/${relativePath.replace(
+                /\\/g,
+                "/"
+            )}`;
+
+        nodes.set(
+            normalizePath(
+                absolutePath
+            ),
+            {
+                absolutePath,
+                publicPath,
+                metadata,
+            }
+        );
+    }
+
+    return nodes;
+}
+
+function collectOutputImports(
+    entryNode: OutputNode,
+    nodes: Map<string, OutputNode>,
+    rootDirectory: string
+): string[] {
+    const imports =
+        new Set<string>();
+
+    const visited =
+        new Set<string>();
+
+    function visit(
+        node: OutputNode
+    ): void {
+        const key =
+            normalizePath(
+                node.absolutePath
+            );
+
+        if (visited.has(key)) {
+            return;
+        }
+
+        visited.add(key);
+
+        for (
+            const imported
+            of node.metadata.imports
+        ) {
+            if (imported.external) {
+                continue;
+            }
+
+            const target =
+                resolveImportedOutput(
+                    node,
+                    imported.path,
+                    nodes,
+                    rootDirectory
+                );
+
+            if (!target) {
+                continue;
+            }
+
+            if (
+                target.publicPath !==
+                    entryNode.publicPath &&
+                /\.(?:m?js)$/i.test(
+                    target.publicPath
+                )
+            ) {
+                imports.add(
+                    target.publicPath
+                );
+            }
+
+            visit(target);
+        }
+    }
+
+    visit(entryNode);
+
+    return Array.from(
+        imports
+    ).sort();
+}
+
+function resolveImportedOutput(
+    source: OutputNode,
+    importPath: string,
+    nodes: Map<string, OutputNode>,
+    rootDirectory: string
+): OutputNode | null {
+    const candidates =
+        path.isAbsolute(
+            importPath
+        )
+            ? [
+                importPath,
+            ]
+            : [
+                path.resolve(
+                    rootDirectory,
+                    importPath
+                ),
+                path.resolve(
+                    path.dirname(
+                        source.absolutePath
+                    ),
+                    importPath
+                ),
+            ];
+
+    for (const candidate of candidates) {
+        const node =
+            nodes.get(
+                normalizePath(
+                    candidate
+                )
+            );
+
+        if (node) {
+            return node;
+        }
+    }
+
+    return null;
+}
+
+function precompressOutput(
+    absolutePath: string,
+    publicPath: string
+): ProductionAssetInfo {
+    const content =
+        fs.readFileSync(
+            absolutePath
+        );
+
+    const raw =
+        content.length;
+
+    let gzip = raw;
+    let brotli = raw;
+
+    if (
+        raw >=
+            PRECOMPRESS_MIN_BYTES &&
+        /\.(?:m?js|css|json|html?|svg|txt|xml)$/i.test(
+            absolutePath
+        )
+    ) {
+        const gzipContent =
+            gzipSync(
+                content,
+                {
+                    level: 9,
+                }
+            );
+
+        if (
+            gzipContent.length < raw
+        ) {
+            fs.writeFileSync(
+                `${absolutePath}.gz`,
+                gzipContent
+            );
+            gzip =
+                gzipContent.length;
+        }
+
+        const brotliContent =
+            brotliCompressSync(
+                content,
+                {
+                    params: {
+                        [constants.BROTLI_PARAM_QUALITY]:
+                            8,
+                    },
+                }
+            );
+
+        if (
+            brotliContent.length < raw
+        ) {
+            fs.writeFileSync(
+                `${absolutePath}.br`,
+                brotliContent
+            );
+            brotli =
+                brotliContent.length;
+        }
+    }
+
+    return {
+        path:
+            publicPath,
+        size: {
+            raw,
+            gzip,
+            brotli,
+        },
+    };
+}
+
+function sumAssetSizes(
+    assetPaths: string[],
+    assets: Map<
+        string,
+        ProductionAssetInfo
+    >
+): ProductionAssetSize {
+    const total:
+        ProductionAssetSize = {
+        raw: 0,
+        gzip: 0,
+        brotli: 0,
+    };
+
+    for (const assetPath of assetPaths) {
+        const asset =
+            assets.get(
+                assetPath
+            );
+
+        if (!asset) {
+            continue;
+        }
+
+        total.raw +=
+            asset.size.raw;
+        total.gzip +=
+            asset.size.gzip;
+        total.brotli +=
+            asset.size.brotli;
+    }
+
+    return total;
+}
+
+function toImportSpecifier(
+    fromDirectory: string,
+    filePath: string
+): string {
+    let relative =
+        path.relative(
+            fromDirectory,
+            filePath
+        )
+            .replace(
+                /\\/g,
+                "/"
+            );
+
+    if (!relative.startsWith(".")) {
+        relative =
+            `./${relative}`;
+    }
+
+    return relative;
+}
+
+function sanitizeName(
+    value: string
+): string {
+    return value.replace(
+        /[^A-Za-z0-9._-]/g,
+        "_"
+    );
+}
+
+function normalizePath(
+    filePath: string
+): string {
+    let normalized =
+        path.normalize(
+            path.resolve(
+                filePath
+            )
+        );
+
+    if (
+        process.platform ===
+        "win32"
+    ) {
+        normalized =
+            normalized.toLowerCase();
+    }
+
+    return normalized;
+}
+
+function escapeJavaScriptString(
+    value: string
+): string {
+    return value
+        .replaceAll(
+            "\\",
+            "\\\\"
+        )
+        .replaceAll(
+            '"',
+            '\\"'
+        );
+}