bun-plugin-stx 0.2.320 → 0.2.322

package/dist/serve.d.ts

@@ -227,6 +227,17 @@ export declare function isRenderableCacheCandidate(html: string): boolean;
  */
 export declare function usableErrorPage(rendered: string | null): string | null;
 export declare function bundleBrowserAsset(entrypoint: string): Promise<Response>;
+/**
+ * The bind budget from an option or config value. Anything that is not a
+ * finite, non-negative number falls back to the default rather than to
+ * "forever", since an unbounded wait is the failure the budget exists to stop.
+ */
+export declare function resolveImageWarmupBindBudget(value: unknown): number;
+/**
+ * Whether `promise` settles within `ms`. It is not cancelled either way: the
+ * caller decides what to do with work that is still running.
+ */
+export declare function settleWithin(promise: Promise<unknown>, ms: number): Promise<boolean>;
 /**
  * Start the STX development server
  * @param options Server options with patterns and port
@@ -235,9 +246,17 @@ export declare function serve(options: ServeOptions): Promise<void>;
 /**
  * Whether any `.stx` template under `root` uses `<StxImage>` or `@image`.
  *
- * Stops at the first hit. Skips dependencies, build output and hidden
- * directories (the stx state directory among them), so it reads the project's
- * own templates, including a framework's templates vendored into it.
+ * Skips dependencies, build output and hidden directories (the stx state
+ * directory among them), so it reads the project's own templates, including a
+ * framework's templates vendored into it.
+ *
+ * A component that wraps `<StxImage>` counts only when something renders it.
+ * Stacks vendors its `Image.stx` component into every app, twice (the
+ * framework defaults and the pantry install tree), so reading a definition as
+ * a use turned the pass on for every Stacks app: one that only ever wrote
+ * plain `<img>` tags spent over seven minutes of each cold boot encoding
+ * 213MB of variants that no page could ask for. A use is followed through
+ * wrappers of wrappers, and a page, layout or partial using one counts.
  */
 export declare function projectUsesImageBuiltins(root: string): Promise<boolean>;
 /**
@@ -256,6 +275,8 @@ export declare const ROUTE_PARAMS_PLACEHOLDER: '__STX_ROUTE_PARAMS__';
 export declare const CSRF_COOKIE: 'X-CSRF-Token';
 /** `/_stx/runtime.js`, `/_stx/router.<16 hex>.js`, … — the shared client scripts. */
 export declare const SHARED_SCRIPT_PATH: unknown;
+/** Default for `imageWarmupBindBudgetMs`: well inside ts-cloud's 180s bind window. */
+export declare const DEFAULT_IMAGE_WARMUP_BIND_BUDGET_MS: unknown;
 /**
  * Build the candidate regexes for a dynamic route file (stacksjs/stx#1927).
  *
@@ -314,6 +335,7 @@ export declare interface ServeOptions {
   cssCacheLimit?: number
   prewarmRenderCache?: boolean | number
   imageWarmupGraceMs?: number
+  imageWarmupBindBudgetMs?: number
   imageWarmup?: boolean | 'auto'
   publicDir?: string
   quiet?: boolean

package/dist/serve.js

@@ -9216,6 +9216,28 @@ async function bundleBrowserAsset(entrypoint) {
     }
   });
 }
+var DEFAULT_IMAGE_WARMUP_BIND_BUDGET_MS = 45000;
+function resolveImageWarmupBindBudget(value) {
+  const ms = typeof value === "string" && value.trim() !== "" ? Number(value) : value;
+  return typeof ms === "number" && Number.isFinite(ms) && ms >= 0 ? ms : DEFAULT_IMAGE_WARMUP_BIND_BUDGET_MS;
+}
+async function settleWithin(promise, ms) {
+  let timer;
+  const settled = promise.then(() => true, () => true);
+  try {
+    return await Promise.race([
+      settled,
+      new Promise((resolve13) => {
+        timer = setTimeout(resolve13, ms, false);
+      })
+    ]);
+  } finally {
+    clearTimeout(timer);
+  }
+}
+function formatSeconds(ms) {
+  return `${(ms / 1000).toFixed(ms < 1e4 ? 1 : 0)}s`;
+}
 async function serve(options) {
   const stxConfig = await loadConfig6({
     name: "stx",
@@ -9260,6 +9282,7 @@ async function serve(options) {
   let placeholdersAreReady = false;
   const imageWarmupSetting = options.imageWarmup ?? stxConfig.imageWarmup ?? "auto";
   const imageWarmupGraceMs = Math.max(0, options.imageWarmupGraceMs ?? 1000);
+  const imageWarmupBindBudgetMs = resolveImageWarmupBindBudget(options.imageWarmupBindBudgetMs ?? stxConfig.imageWarmupBindBudgetMs);
   function awaitImageWarmup() {
     if (placeholdersAreReady || imageWarmupGraceMs === 0)
       return;
@@ -10373,9 +10396,10 @@ ${block}`;
       const publicRoot = nodePath.resolve(process19.cwd(), publicDir);
       const [placeholderResult, deliveryResult] = await Promise.allSettled([
         stx.warmImagePlaceholders(publicRoot, {
-          cachePath: imagePlaceholderCachePath
+          cachePath: imagePlaceholderCachePath,
+          offThread: true
         }),
-        stx.prepareImageDelivery(publicRoot, imageDeliveryOutputDir)
+        stx.prepareImageDelivery(publicRoot, imageDeliveryOutputDir, { offThread: true })
       ]);
       const derived = placeholderResult.status === "fulfilled" ? placeholderResult.value : 0;
       if (derived > 0 && !production)
@@ -10387,8 +10411,17 @@ ${block}`;
       markPlaceholdersReady();
     }
   }
-  if (production)
-    await runImageWarmup();
+  if (production) {
+    const warmupStartedAt = performance.now();
+    const warmup = runImageWarmup();
+    const bound = await settleWithin(warmup, imageWarmupBindBudgetMs);
+    if (!bound) {
+      console.warn(`[stx] image warm-up still running after ${formatSeconds(imageWarmupBindBudgetMs)}; binding now and finishing it in the background. Images fall back to the original files until it completes. A cold image cache (first deploy, a cleared STX_IMAGE_CACHE_DIR, an encoder upgrade) is the usual cause; the next start reuses what this one encodes.`);
+      warmup.then(() => {
+        console.log(`[stx] image warm-up finished after ${formatSeconds(performance.now() - warmupStartedAt)}`);
+      });
+    }
+  }
   const portAutoIncrement = options.autoIncrementPort ?? true;
   const maxPortAttempts = portAutoIncrement === false ? 1 : typeof portAutoIncrement === "number" ? Math.max(1, portAutoIncrement) : 10;
   let actualPort = port;
@@ -11182,8 +11215,20 @@ if (import.meta.main) {
 }
 var IMAGE_BUILTIN_PATTERN = /<(?:StxImage|Image|stx-image|stx-img)[\s/>]|@image\s*\(/;
 var TEMPLATE_SCAN_SKIP = new Set(["node_modules", "dist", "build", "coverage", "vendor"]);
+function escapeRegExp(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function kebabCase(name) {
+  return name.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/([A-Z])([A-Z][a-z])/g, "$1-$2").toLowerCase();
+}
+function usesComponent(source, name) {
+  const kebab = kebabCase(name);
+  const spellings = (kebab.includes("-") ? [name, kebab] : [name]).map(escapeRegExp).join("|");
+  return new RegExp(`<(?:${spellings})[\\s/>]|@component\\(\\s*['"](?:${spellings})['"]`).test(source);
+}
 async function projectUsesImageBuiltins(root) {
   const { readdir: readdir4, readFile } = await import("fs/promises");
+  const templates = [];
   const pending = [root];
   while (pending.length > 0) {
     const dir = pending.pop();
@@ -11204,10 +11249,38 @@ async function projectUsesImageBuiltins(root) {
       }
       if (!entry.isFile() || !entry.name.endsWith(".stx"))
         continue;
+      let source;
       try {
-        if (IMAGE_BUILTIN_PATTERN.test(await readFile(full, "utf8")))
-          return true;
-      } catch {}
+        source = await readFile(full, "utf8");
+      } catch {
+        continue;
+      }
+      const inComponents = nodePath.relative(root, dir).split(nodePath.sep).includes("components");
+      const component = inComponents ? entry.name.slice(0, -".stx".length) : undefined;
+      if (!component && IMAGE_BUILTIN_PATTERN.test(source))
+        return true;
+      templates.push({ source, component });
+    }
+  }
+  const imageComponents = new Set;
+  const queue = [];
+  for (const template of templates) {
+    if (template.component && IMAGE_BUILTIN_PATTERN.test(template.source) && !imageComponents.has(template.component)) {
+      imageComponents.add(template.component);
+      queue.push(template.component);
+    }
+  }
+  while (queue.length > 0) {
+    const name = queue.shift();
+    for (const template of templates) {
+      if (template.component === name || !usesComponent(template.source, name))
+        continue;
+      if (!template.component)
+        return true;
+      if (!imageComponents.has(template.component)) {
+        imageComponents.add(template.component);
+        queue.push(template.component);
+      }
     }
   }
   return false;
@@ -11216,12 +11289,14 @@ export {
   usableErrorPage,
   staticCacheControl,
   sharedScriptCacheControl,
+  settleWithin,
   serverScriptsReadParams,
   serve,
   serializeRouteParams,
   routeSpecificity,
   responseTakesCsrfCookie,
   resolveServeOpenUrl,
+  resolveImageWarmupBindBudget,
   render404Page,
   publicFileExists,
   projectUsesImageBuiltins,
@@ -11241,5 +11316,6 @@ export {
   boundedCache,
   SHARED_SCRIPT_PATH,
   ROUTE_PARAMS_PLACEHOLDER,
+  DEFAULT_IMAGE_WARMUP_BIND_BUDGET_MS,
   CSRF_COOKIE
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bun-plugin-stx",
   "type": "module",
-  "version": "0.2.320",
+  "version": "0.2.322",
   "description": "A Bun plugin that allows for using Laravel Blade-like syntax.",
   "author": "Chris Breuer <chris@stacksjs.org>",
   "license": "MIT",