@hyperspan/framework 1.0.4 → 1.0.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperspan/framework",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "description": "Hyperspan Web Framework",
   "main": "src/server.ts",
   "types": "src/server.ts",

package/src/client/js.ts

@@ -10,6 +10,7 @@ export const JS_PUBLIC_PATH = '/_hs/js';
 export const JS_ISLAND_PUBLIC_PATH = '/_hs/js/islands';
 export const JS_IMPORT_MAP = new Map<string, string>();
 const CLIENT_JS_CACHE = new Map<string, { esmName: string, exports: string, fnArgs: string, publicPath: string }>();
+const CLIENT_JS_BUILD_PROMISES = new Map<string, Promise<void>>();
 const EXPORT_REGEX = /export\{(.*)\}/g;
 
 /**
@@ -21,41 +22,57 @@ export async function buildClientJS(modulePathResolved: string): Promise<HS.Clie
 
   // Cache: Avoid re-processing the same file
   if (!CLIENT_JS_CACHE.has(assetHash)) {
-    // Build the client JS module
-    const result = await Bun.build({
-      entrypoints: [modulePath],
-      outdir: join(CWD, './public', JS_PUBLIC_PATH), // @TODO: Make this configurable... should be read from config file...
-      naming: IS_PROD ? '[dir]/[name]-[hash].[ext]' : undefined,
-      external: Array.from(JS_IMPORT_MAP.keys()),
-      minify: true,
-      format: 'esm',
-      target: 'browser',
-      env: 'APP_PUBLIC_*',
-    });
+    const existingBuild = CLIENT_JS_BUILD_PROMISES.get(assetHash);
+    // Await the existing build promise if it exists (this can get called in parallel from Bun traversing imports)
+    if (existingBuild) {
+      await existingBuild;
+    } else {
+      const buildPromise = (async () => {
+        // Build the client JS module
+        const result = await Bun.build({
+          entrypoints: [modulePath],
+          outdir: join(CWD, './public', JS_PUBLIC_PATH), // @TODO: Make this configurable... should be read from config file...
+          naming: IS_PROD ? '[dir]/[name]-[hash].[ext]' : undefined,
+          external: Array.from(JS_IMPORT_MAP.keys()),
+          minify: true,
+          format: 'esm',
+          target: 'browser',
+          env: 'APP_PUBLIC_*',
+        });
 
-    // Add output file to import map
-    const esmName = String(result.outputs[0].path.split('/').reverse()[0]).replace('.js', '');
-    const publicPath = `${JS_PUBLIC_PATH}/${esmName}.js`;
-    JS_IMPORT_MAP.set(esmName, publicPath);
+        // Add output file to import map
+        const esmName = String(result.outputs[0].path.split('/').reverse()[0]).replace('.js', '');
+        const publicPath = `${JS_PUBLIC_PATH}/${esmName}.js`;
+        JS_IMPORT_MAP.set(esmName, publicPath);
 
-    // Get the contents of the file to extract the exports
-    const contents = await result.outputs[0].text();
-    const exportLine = EXPORT_REGEX.exec(contents);
+        // Get the contents of the file to extract the exports
+        const contents = await result.outputs[0].text();
+        const exportLine = EXPORT_REGEX.exec(contents);
 
-    let exports = '{}';
-    if (exportLine) {
-      const exportName = exportLine[1];
-      exports =
-        '{' +
-        exportName
-          .split(',')
-          .map((name) => name.trim().split(' as '))
-          .map(([name, alias]) => `${alias === 'default' ? 'default as ' + name : alias}`)
-          .join(', ') +
-        '}';
+        let exports = '{}';
+        if (exportLine) {
+          const exportName = exportLine[1];
+          exports =
+            '{' +
+            exportName
+              .split(',')
+              .map((name) => name.trim().split(' as '))
+              .map(([name, alias]) => `${alias === 'default' ? 'default as ' + name : alias}`)
+              .join(', ') +
+            '}';
+        }
+        const fnArgs = exports.replace(/(\w+)\s*as\s*(\w+)/g, '$1: $2');
+
+        CLIENT_JS_CACHE.set(assetHash, { esmName, exports, fnArgs, publicPath });
+      })();
+
+      CLIENT_JS_BUILD_PROMISES.set(assetHash, buildPromise);
+      try {
+        await buildPromise;
+      } finally {
+        CLIENT_JS_BUILD_PROMISES.delete(assetHash);
+      }
     }
-    const fnArgs = exports.replace(/(\w+)\s*as\s*(\w+)/g, '$1: $2');
-    CLIENT_JS_CACHE.set(assetHash, { esmName, exports, fnArgs, publicPath });
   }
 
   const { esmName, exports, fnArgs, publicPath } = CLIENT_JS_CACHE.get(assetHash)!;

package/src/types.ts

@@ -186,6 +186,6 @@ export namespace Hyperspan {
      * @param loadScript - A function that loads the module or a string of code to load the module
      * @returns HSHtml Template with the <script type="module"> tag
      */
-    renderScriptTag: (loadScript?: ((module: unknown) => HSHtml | string) | string) => HSHtml;
+    renderScriptTag: (loadScript?: ((module: unknown) => HSHtml | string | void) | string) => HSHtml;
   }
 }