@bakery-framework/plugin-vue 2.0.0-alpha.12 → 2.0.0-alpha.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bakery-framework/plugin-vue",
-  "version": "2.0.0-alpha.12",
+  "version": "2.0.0-alpha.13",
   "description": "Bakery vue plugin.",
   "keywords": [
     "bakery",
@@ -43,7 +43,7 @@
     "vue": "^3.5.38"
   },
   "dependencies": {
-    "@bakery-framework/core": "^2.0.0-alpha.12"
+    "@bakery-framework/core": "^2.0.0-alpha.13"
   },
   "engines": {
     "bun": ">=1.4.0"

package/src/compile.ts

@@ -14,17 +14,49 @@ import type {
   VuePluginOptions,
 } from './types'
 
-let compiler: typeof import('@vue/compiler-sfc')
+/**
+ * The **promise**, not the module.
+ *
+ * `compiler` was assigned after the await, so two requests arriving before the
+ * first load finished each started their own `await import()`. Bun's module
+ * cache made that harmless rather than correct; memoising the promise is what
+ * actually makes it one load, and it is what lets `preloadCompiler()` below
+ * overlap with the rest of boot while a request that beats it simply awaits
+ * the same thing.
+ */
+let compilerLoad: Promise<typeof import('@vue/compiler-sfc')> | null = null
 
 async function loadCompiler() {
-  if (!compiler) {
-    try {
-      compiler = await import('@vue/compiler-sfc')
-    } catch {
+  if (!compilerLoad) {
+    compilerLoad = import('@vue/compiler-sfc').catch(() => {
+      // Cleared so a later attempt can retry - a package installed while the
+      // dev server is running should not need a restart to be found.
+      compilerLoad = null
       throw new Error('compiler-sfc not available. Run `bun add vue`.')
-    }
+    })
   }
-  return compiler
+  return await compilerLoad
+}
+
+/**
+ * Start loading the compiler now rather than on the first `.vue` request.
+ *
+ * `@vue/compiler-sfc` is a large module: measured from this repo's example
+ * app, **168-173 ms warm and 1,848 ms on a cold filesystem**, and every server
+ * process paid it inside the first Vue page it served. Called from the
+ * plugin's `onStart`, where it overlaps with the rest of boot.
+ *
+ * Deliberately not awaited by the caller and deliberately not fatal. An app
+ * can register this plugin before it has written a single `.vue` file, and
+ * refusing to boot over a package it does not need yet would be worse than
+ * the clear error the first request already gets. The rejection is swallowed
+ * here and `loadCompiler` raises it properly when something actually needs
+ * the compiler.
+ */
+export function preloadCompiler(): void {
+  void loadCompiler().catch(() => {
+    // See above: absence is reported at the point of use, not at boot.
+  })
 }
 
 let vuePluginOptions: VuePluginOptions = {}
@@ -182,8 +214,8 @@ export async function compileTemplateBlock(
 export async function compileStyleBlock(
   options: CompileStyleOptions,
 ): Promise<SFCStyleCompileResults> {
-  await loadCompiler()
-  return compiler.compileStyle({
+  const sfc = await loadCompiler()
+  return sfc.compileStyle({
     source: options.style.content,
     filename: 'style.css',
     id: options.id,

package/src/handler.ts

@@ -173,18 +173,60 @@ function containsRouteFile(dir: string, exts: string[]): boolean {
  * intercepted — that is the spelling for linking a raw file out of a
  * catch-all's subtree, and what `docs/plugins/vue.md` prescribes.
  *
- * Computed per page request, so files added or removed in dev are seen on the
- * next load without cache ceremony.
+ * Computed per page request in development, so a file added or removed is
+ * seen on the next load without cache ceremony. **Memoised in production**,
+ * where it cannot change: there is no watcher, and the `SIGHUP` handler in
+ * `core/init.ts` is a deliberate no-op, so the only way the page tree changes
+ * is a restart.
+ *
+ * Worth the branch because the walk recurses into every sibling directory to
+ * ask whether it holds a route file, and it runs on **every** catch-all page
+ * request. Measured against directory trees of an app's shape, three rounds
+ * each with a CPU-bound control flat at 33 ms:
+ *
+ *      4 directories, depth 2, 10 claims     0.48 ms
+ *     12 directories, depth 3, 24 claims     1.24 ms
+ *     30 directories, depth 4, 50 claims     4.44 ms
+ *
+ * An `LRUCache` rather than a plain map, per convention 6. The key is a
+ * resolved disk path that routing produced, not anything a client sends, so
+ * it is bounded by the app's own catch-all count either way - but the bound
+ * is stated rather than argued.
+ */
+const claimedCache = new LRUCache<
+  string,
+  { claimed: string[]; claimedSingle: boolean }
+>(100)
+
+/**
+ * Test seam (convention 9).
+ *
+ * **A test process reports `PROD === '1'`**, so this memo is *on* by default
+ * under `bun test` — a test that writes into a page directory between two
+ * calls is running against the production behaviour whether it meant to or
+ * not. Clear it between such calls, or ask for development explicitly with
+ * `withEnvFlag('PROD', false, …)`.
  */
+export function __resetClaimedCache(): void {
+  claimedCache.clear()
+}
+
 export function claimedBeside(catchAllFile: string): {
   claimed: string[]
   claimedSingle: boolean
 } {
+  const resolved = fs.resolve(catchAllFile)
+  const memoised = import.meta.env.PROD === '1'
+  if (memoised) {
+    const hit = claimedCache.get(resolved)
+    if (hit) return hit
+  }
+
   const claimed = new Set<string>()
   let claimedSingle = false
 
-  const dir = fs.resolve(catchAllFile).replace(/\/[^/]*$/, '')
-  const self = fs.resolve(catchAllFile).slice(dir.length + 1)
+  const dir = resolved.replace(/\/[^/]*$/, '')
+  const self = resolved.slice(dir.length + 1)
   // The handler's own table (`['vue']`), read at call time so the two cannot
   // drift apart.
   const exts = VueHandler.config.ext.map(ext => `.${ext}`)
@@ -195,8 +237,11 @@ export function claimedBeside(catchAllFile: string): {
   } catch {
     // Unreadable directory: no visible siblings means nothing extra claimed,
     // and a hard load still routes correctly — the stamp is an optimisation
-    // of honesty, not the source of it.
-    return { claimed: [], claimedSingle: false }
+    // of honesty, not the source of it. Remembered like any other answer, so
+    // an unreadable directory does not re-throw on every request.
+    const empty = { claimed: [], claimedSingle: false }
+    if (memoised) claimedCache.set(resolved, empty)
+    return empty
   }
 
   for (const entry of entries) {
@@ -223,7 +268,9 @@ export function claimedBeside(catchAllFile: string): {
     if (stem && stem !== name) claimed.add(stem)
   }
 
-  return { claimed: [...claimed], claimedSingle }
+  const result = { claimed: [...claimed], claimedSingle }
+  if (memoised) claimedCache.set(resolved, result)
+  return result
 }
 
 export class VueHandler extends DynamicHandler {

package/src/index.ts

@@ -1,4 +1,5 @@
 import { definePlugin } from '@bakery-framework/core/plugins'
+import { preloadCompiler } from './compile'
 import { setVuePluginOptions } from './compile'
 import type { VuePluginOptions } from './types'
 import { rewriteVueImports } from './utils'
@@ -48,6 +49,19 @@ export default function vuePlugin(options?: VuePluginOptions) {
       const { setupVue } = await import('./setup')
       await setupVue()
     },
+
+    /**
+     * Start loading `@vue/compiler-sfc` while the rest of boot runs.
+     *
+     * It is 168-173 ms warm and 1,848 ms on a cold filesystem, and without
+     * this every server process paid it inside the first Vue page it served.
+     * Not awaited: the load overlaps with everything else here, and a request
+     * that arrives before it finishes awaits the same promise rather than
+     * starting a second one.
+     */
+    onStart() {
+      preloadCompiler()
+    },
     onCompile(content, path) {
       if (
         !path.endsWith('.ts') &&