zuby 1.0.46 → 1.0.48

package/commands/index.js

@@ -32,6 +32,10 @@ program
 program
     .command('init')
     .description('Initializes a new Zuby project')
+    .option('-p, --project-path <path>', 'The relative path to the project directory')
+    .option('-j, --jsx-provider-name <name>', 'The name of the JSX provider to use (react, preact)')
+    .option('-e, --example-name <name>', 'The name of the example project to use (basic)')
+    .option('-t, --use-typescript', 'Add this flag to use TypeScript instead of JavaScript')
     .action(async (options) => init(options));
 program
     .command('info')

package/commands/init.d.ts

@@ -1,5 +1,5 @@
 import { InitCommandOptions } from '../types.js';
-export default function init(options: InitCommandOptions): Promise<void>;
+export default function init({ projectPath, jsxProviderName, exampleName, useTypescript, }: InitCommandOptions): Promise<void>;
 export declare function initExample(example: Example, options: InitOptions): Promise<void>;
 export declare function getExamples(): Example[];
 export interface Example {

package/commands/init.js

@@ -11,7 +11,7 @@ import { getZubyPackageConfig } from '../packageConfig.js';
 import { globSync } from 'glob';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
-export default async function init(options) {
+export default async function init({ projectPath, jsxProviderName, exampleName, useTypescript, }) {
     const logger = createLogger();
     logger.clearScreen('info');
     logger?.info(`${getTitle(`Let's get started with Zuby`)}\r\n`);
@@ -19,44 +19,79 @@ export default async function init(options) {
     const examples = getExamples();
     const defaultProjectName = 'my-zuby-app';
     const defaultExample = examples.find(example => example.name === 'basic');
-    const { projectPath, jsxProviderName, exampleName } = await inquirer.prompt([
-        {
-            type: 'input',
-            name: 'projectPath',
-            message: 'Where would you like to create your new project?',
-            default: `./${defaultProjectName}`,
-            prefix: `${chalk.yellowBright.bgWhite(' name    ')} ❯ `,
-            validate(projectPath) {
-                if (existsSync(projectPath)) {
-                    return 'Project with this name already exists. Please choose a different one.';
-                }
-                return true;
+    const jsxProviderNames = ['preact', 'react'];
+    const exampleNames = examples.map(example => example.name);
+    const validateProjectPath = (projectPath) => {
+        if (existsSync(projectPath)) {
+            return 'Project with this name already exists. Please choose a different one.';
+        }
+        return true;
+    };
+    const validateJsxProviderName = (name) => {
+        if (!jsxProviderNames.includes(name)) {
+            return `Invalid JSX provider name. Please choose one of the following: ${jsxProviderNames.join(',')}.`;
+        }
+        return true;
+    };
+    const validateExampleName = (name) => {
+        if (!exampleNames.includes(name)) {
+            return `Invalid example project name. Please choose one of the following: ${exampleNames.join(',')}.`;
+        }
+        return true;
+    };
+    if (!projectPath || validateProjectPath(projectPath) !== true) {
+        ({ projectPath } = await inquirer.prompt([
+            {
+                type: 'input',
+                name: 'projectPath',
+                message: 'Where would you like to create your new project?',
+                default: `./${defaultProjectName}`,
+                prefix: `${chalk.yellowBright.bgWhite(' name    ')} ❯ `,
+                validate: validateProjectPath,
+            },
+        ]));
+    }
+    else {
+        logger.info(`Project path: ${projectPath}`);
+    }
+    if (!jsxProviderName || validateJsxProviderName(jsxProviderName) !== true) {
+        ({ jsxProviderName } = await inquirer.prompt([
+            {
+                type: 'list',
+                name: 'jsxProviderName',
+                message: 'In which JSX framework would you like to write your components?',
+                choices: jsxProviderNames,
+                default: jsxProviderNames?.[0],
+                prefix: `${chalk.yellowBright.bgWhite(' jsx     ')} ❯ `,
+                validate: validateJsxProviderName,
+            },
+        ]));
+    }
+    else {
+        logger.info(`Jsx Provider: ${jsxProviderName}`);
+    }
+    if (!exampleName || validateExampleName(exampleName) !== true) {
+        ({ exampleName } = await inquirer.prompt([
+            {
+                type: 'list',
+                name: 'exampleName',
+                message: 'Which Zuby example project would you like to use?',
+                choices: exampleNames,
+                default: defaultExample?.name,
+                prefix: `${chalk.yellowBright.bgWhite(' example ')} ❯ `,
+                validate: validateExampleName,
             },
-        },
-        {
-            type: 'list',
-            name: 'jsxProviderName',
-            message: 'In which JSX framework would you like to write your components?',
-            choices: ['preact', 'react'],
-            default: 'preact',
-            prefix: `${chalk.yellowBright.bgWhite(' jsx     ')} ❯ `,
-        },
-        {
-            type: 'list',
-            name: 'exampleName',
-            message: 'Which Zuby example project would you like to use?',
-            choices: examples.map(example => example.name),
-            default: defaultExample?.name,
-            prefix: `${chalk.yellowBright.bgWhite(' example ')} ❯ `,
-        },
-    ]);
-    let useTypescript = false;
+        ]));
+    }
+    else {
+        logger.info(`Example project: ${exampleName}`);
+    }
     const selectedExample = examples.find(example => example.name === exampleName);
     if (!selectedExample) {
         logger.error(`Example ${exampleName} was not found`);
         process.exit(1);
     }
-    if (selectedExample?.isTs) {
+    if (useTypescript === undefined && selectedExample?.isTs) {
         ({ useTypescript } = await inquirer.prompt([
             {
                 type: 'confirm',
@@ -67,7 +102,7 @@ export default async function init(options) {
             },
         ]));
     }
-    const projectName = projectPath.split('/').pop() || defaultProjectName;
+    const projectName = projectPath?.split('/').pop() || defaultProjectName;
     const zubyVersion = getZubyPackageConfig().version;
     await initExample(selectedExample, {
         projectName,

package/config.d.ts

@@ -48,3 +48,7 @@ export type ExecutePluginsParams = Omit<ZubyHookParams, 'command' | 'logger' | '
  * @param plugins
  */
 export declare const normalizePlugins: (plugins: (ZubyPlugin | ZubyPlugin[] | VitePluginOption | VitePluginOption[])[]) => Promise<(ZubyPlugin | VitePlugin)[]>;
+/**
+ * Returns random build ID.
+ */
+export declare const generateDefaultBuildId: () => string;

package/config.js

@@ -1,6 +1,7 @@
 import { PLUGIN_HOOKS, } from './types.js';
 import { BUILD_CHUNKS_MANIFEST, ZUBY_CONFIG_FILE } from './constants.js';
 import { existsSync } from 'fs';
+import { randomBytes } from 'crypto';
 import { bundleRequire } from 'bundle-require';
 import { createLogger } from './logger/index.js';
 // Plugins
@@ -10,6 +11,7 @@ import chunkNamingPlugin from './plugins/chunkNamingPlugin/index.js';
 import manifestPlugin from './plugins/manifestPlugin/index.js';
 import prerenderPlugin from './plugins/prerenderPlugin/index.js';
 import standaloneBuildPlugin from './plugins/dependenciesPlugin/index.js';
+import preloadPlugin from './plugins/preloadPlugin/index.js';
 let zubyInternalConfig;
 /**
  * Returns the path to the ZubyConfig file.
@@ -102,6 +104,8 @@ export const mergeDefaultConfig = async (config) => {
     config.minifyCSS = config.minifyCSS ?? true;
     config.minifyHTML = config.minifyHTML ?? true;
     config.minifyJS = config.minifyJS ?? true;
+    // Build ID generator
+    config.generateBuildId = config.generateBuildId ?? generateDefaultBuildId;
     // Add logger
     config.customLogger =
         config.customLogger ??
@@ -133,6 +137,7 @@ export const mergeDefaultConfig = async (config) => {
     return {
         ...config,
         templateExtensions: ['js', 'jsx', 'ts', 'tsx'],
+        buildId: await config.generateBuildId(),
     };
 };
 /**
@@ -148,6 +153,7 @@ export const getBuiltInPlugins = () => {
         manifestPlugin(),
         prerenderPlugin(),
         standaloneBuildPlugin(),
+        preloadPlugin(),
     ];
 };
 /**
@@ -204,3 +210,9 @@ export const normalizePlugins = async (plugins) => {
         // Remove false, undefined, null values
         .filter(plugin => !!plugin);
 };
+/**
+ * Returns random build ID.
+ */
+export const generateDefaultBuildId = () => {
+    return randomBytes(8).toString('hex');
+};

package/constants.d.ts

@@ -2,6 +2,7 @@ export declare const ZUBY_CONFIG_FILE = "zuby.config.mjs";
 export declare const BUILD_CHUNKS_MANIFEST = "chunks-manifest.json";
 export declare const CLIENT_CHUNKS_MANIFEST = "client-chunks-manifest.json";
 export declare const SERVER_CHUNKS_MANIFEST = "server-chunks-manifest.json";
+export declare const PREALOD_MANIFEST = "preload-manifest.json";
 export declare const PAGES_MANIFEST = "pages-manifest.json";
 export declare const HTTP_HEADERS: {
     Age: string;
@@ -24,3 +25,6 @@ export declare const HTTP_HEADERS: {
     XZubyCacheTTL: string;
     XZubyCache: string;
 };
+export declare const ZUBY_USER_AGENTS: {
+    Prerenderer: string;
+};

package/constants.js

@@ -2,6 +2,7 @@ export const ZUBY_CONFIG_FILE = 'zuby.config.mjs';
 export const BUILD_CHUNKS_MANIFEST = 'chunks-manifest.json';
 export const CLIENT_CHUNKS_MANIFEST = 'client-chunks-manifest.json';
 export const SERVER_CHUNKS_MANIFEST = 'server-chunks-manifest.json';
+export const PREALOD_MANIFEST = 'preload-manifest.json';
 export const PAGES_MANIFEST = 'pages-manifest.json';
 export const HTTP_HEADERS = {
     // Standard HTTP headers
@@ -27,3 +28,7 @@ export const HTTP_HEADERS = {
     XZubyCacheTTL: 'X-Zuby-Cache-TTL',
     XZubyCache: 'X-Zuby-Cache',
 };
+export const ZUBY_USER_AGENTS = {
+    // Zuby user agents
+    Prerenderer: 'zuby-prerender',
+};

package/context/index.d.ts

@@ -9,6 +9,7 @@ export declare class ZubyContext {
         layouts?: import("../templates/types.js").LazyTemplate[] | undefined;
         innerLayouts?: import("../templates/types.js").LazyTemplate[] | undefined;
         handlers?: import("../templates/types.js").LazyTemplate[] | undefined;
+        loaders?: import("../templates/types.js").LazyTemplate[] | undefined;
     } | undefined;
     get site(): string | undefined;
     get generator(): string | undefined;
@@ -19,5 +20,6 @@ export declare class ZubyContext {
         locales: string[];
         defaultLocale: string;
     } | undefined;
+    get buildId(): string | undefined;
 }
 export declare const getContext: () => ZubyContext;

package/context/index.js

@@ -23,6 +23,9 @@ export class ZubyContext {
     get i18n() {
         return this.rawContext.i18n;
     }
+    get buildId() {
+        return this.rawContext.buildId;
+    }
 }
 const getRawContext = () => {
     return globalThis.ZubyRawContext;

package/context/types.d.ts

@@ -11,6 +11,7 @@ export interface ZubyRawContext {
         layouts?: LazyTemplate[];
         innerLayouts?: LazyTemplate[];
         handlers?: LazyTemplate[];
+        loaders?: LazyTemplate[];
     };
     /**
      * The render module from JsxProvider.
@@ -34,6 +35,10 @@ export interface ZubyRawContext {
      * @example 1.0.0
      */
     version?: string;
+    /**
+     * The build ID of the site.
+     */
+    buildId?: string;
     /**
      * The internalization config from ZubyConfig.
      * @example {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zuby",
-  "version": "1.0.46",
+  "version": "1.0.48",
   "description": "Zuby.js is framework for building SPA apps using Vite",
   "type": "module",
   "main": "index.js",

package/pageContext/index.d.ts

@@ -82,6 +82,7 @@ export declare class ZubyPageContext {
         layouts?: import("../templates/types.js").LazyTemplate[] | undefined;
         innerLayouts?: import("../templates/types.js").LazyTemplate[] | undefined;
         handlers?: import("../templates/types.js").LazyTemplate[] | undefined;
+        loaders?: import("../templates/types.js").LazyTemplate[] | undefined;
     } | undefined;
     /**
      * The object with props that should be passed to the page component.
@@ -166,4 +167,14 @@ export declare class ZubyPageContext {
      * @example localizePath('/products/1', 'en') => /products/1
      */
     localizePath(path: string, locale?: string | undefined): string;
+    /**
+     * Returns true if the current request
+     * was made by the Zuby.js pre-render build step.
+     */
+    get isPrerendering(): boolean;
+    /**
+     * The current build ID of the site.
+     * @example ecdf1a94cc9b4f4c
+     */
+    get buildId(): string | undefined;
 }

package/pageContext/index.js

@@ -218,4 +218,18 @@ export class ZubyPageContext {
             return path;
         return `/${locale}/${path}`.replace(/\/+/g, '/');
     }
+    /**
+     * Returns true if the current request
+     * was made by the Zuby.js pre-render build step.
+     */
+    get isPrerendering() {
+        return this._request?.headers?.get('user-agent') === 'zuby-prerender';
+    }
+    /**
+     * The current build ID of the site.
+     * @example ecdf1a94cc9b4f4c
+     */
+    get buildId() {
+        return this._zubyContext.buildId;
+    }
 }

package/plugins/contextPlugin/index.d.ts

@@ -4,4 +4,6 @@ export default function index(): VitePlugin;
 export declare function generateCompileTimeContextCode(ssr: boolean): Promise<string>;
 export declare function generateTemplatesCode(ssr: boolean): Promise<string>;
 export declare function generateTemplateCode(template: Template): Promise<string>;
+export declare function generateImportCode(template: Template): string;
 export declare function generateRenderCode(ssr: boolean): Promise<string>;
+export declare function getStaticImportsCode(): string;

package/plugins/contextPlugin/index.js

@@ -1,9 +1,11 @@
 import { getZubyInternalConfig } from '../../config.js';
+import { SYNC_TEMPLATES } from '../../templates/types.js';
 import { relative } from 'path';
 import { normalizePath } from '../../utils/pathUtils.js';
 import { getZubyPackageConfig } from '../../packageConfig.js';
-import { getApps, getErrors, getHandlers, getInnerLayouts, getLayouts, getPages, getTemplates, } from '../../templates/index.js';
+import { getApps, getErrors, getHandlers, getInnerLayouts, getLayouts, getLoaders, getPages, getTemplates, } from '../../templates/index.js';
 let viteConfig;
+let staticImports = [];
 export default function index() {
     return {
         name: 'zuby-context-plugin',
@@ -17,12 +19,13 @@ export default function index() {
                 return;
             }
             const contextCode = await generateCompileTimeContextCode(ssr);
-            return contextCode + code;
+            const staticImportsCode = getStaticImportsCode();
+            return staticImportsCode + contextCode + code;
         },
     };
 }
 export async function generateCompileTimeContextCode(ssr) {
-    const { site, i18n } = await getZubyInternalConfig();
+    const { site, i18n, buildId } = await getZubyInternalConfig();
     const { version } = await getZubyPackageConfig();
     return `globalThis.ZubyRawContext = {
         ...(globalThis.ZubyRawContext || {}),
@@ -31,6 +34,7 @@ export async function generateCompileTimeContextCode(ssr) {
         site: '${site || ''}',
         generator: 'Zuby.js ${version}',
         version: '${version}',
+        buildId: '${buildId}',
         i18n: ${JSON.stringify(i18n)},
     };`;
 }
@@ -42,6 +46,7 @@ export async function generateTemplatesCode(ssr) {
     const innerLayouts = await getInnerLayouts(templates);
     const errors = await getErrors(templates);
     const handlers = await getHandlers(templates);
+    const loaders = await getLoaders(templates);
     const pagesCode = await Promise.all(pages.map(generateTemplateCode) || []);
     const appsCode = await Promise.all(apps.map(generateTemplateCode) || []);
     const errorsCode = await Promise.all(errors.map(generateTemplateCode) || []);
@@ -50,6 +55,7 @@ export async function generateTemplatesCode(ssr) {
         ? await Promise.all(innerLayouts.map(generateTemplateCode) || [])
         : [];
     const handlersCode = ssr ? await Promise.all(handlers.map(generateTemplateCode) || []) : [];
+    const loadersCode = await Promise.all(loaders.map(generateTemplateCode) || []);
     return `{
         pages: [${pagesCode.join(',')}],
         apps: [${appsCode.join(',')}],
@@ -57,6 +63,7 @@ export async function generateTemplatesCode(ssr) {
         layouts: [${layoutsCode.join(',')}],
         innerLayouts: [${innerLayoutsCode.join(',')}],
         handlers: [${handlersCode.join(',')}],
+        loaders: [${loadersCode.join(',')}],
     }`;
 }
 export async function generateTemplateCode(template) {
@@ -67,12 +74,28 @@ export async function generateTemplateCode(template) {
         pathParams: ${JSON.stringify(template.pathParams)},
         pathType: "${template.pathType}",
         templateType: "${template.templateType}",
-        component: () => import("${template.filename}"),
+        component: () => ${generateImportCode(template)},
     }`;
 }
+export function generateImportCode(template) {
+    // Sync templates are imported statically
+    if (Object.values(SYNC_TEMPLATES).includes(template.templateType)) {
+        const key = `__zuby_static_import_${staticImports.length}`;
+        staticImports.push({
+            key,
+            path: template.filename,
+        });
+        return key;
+    }
+    // Async templates are imported dynamically
+    return `import("${template.filename}")`;
+}
 export async function generateRenderCode(ssr) {
     const { jsx } = await getZubyInternalConfig();
     if (!ssr)
         return '{}';
     return `await import("${jsx.renderFile}")`;
 }
+export function getStaticImportsCode() {
+    return staticImports.map(({ key, path }) => `import ${key} from "${path}";`).join('\n');
+}

package/plugins/preloadPlugin/index.d.ts

@@ -0,0 +1,7 @@
+import { ZubyPlugin } from '../../types.js';
+/**
+ * This is internal plugin
+ * that generates preload manifest file
+ * that is used for preloading assets.
+ */
+export default function preloadPlugin(): ZubyPlugin;

package/plugins/preloadPlugin/index.js

@@ -0,0 +1,27 @@
+import { writeFileSync } from 'fs';
+import { join, relative } from 'path';
+import { normalizePath } from '../../utils/pathUtils.js';
+import { getPages } from '../../templates/index.js';
+import { PREALOD_MANIFEST } from '../../constants.js';
+/**
+ * This is internal plugin
+ * that generates preload manifest file
+ * that is used for preloading assets.
+ */
+export default function preloadPlugin() {
+    return {
+        name: 'zuby-preload-plugin',
+        hooks: {
+            'zuby:build:done': async ({ config, clientChunksManifest, templates }) => {
+                const { srcDir, outDir } = config;
+                const preloadManifest = {};
+                const pages = await getPages(templates);
+                pages.forEach(page => {
+                    const filename = normalizePath(relative(srcDir, page.filename));
+                    preloadManifest[filename] = clientChunksManifest[filename] || [];
+                });
+                writeFileSync(normalizePath(join(outDir, 'client', PREALOD_MANIFEST)), JSON.stringify(preloadManifest, null, 2));
+            },
+        },
+    };
+}

package/plugins/prerenderPlugin/index.js

@@ -9,7 +9,7 @@ import { OUTPUTS } from '../../types.js';
 import { PATH_TYPES } from '../../templates/types.js';
 import { substitutePathParams } from '../../templates/pathUtils.js';
 import { normalizePath } from '../../utils/pathUtils.js';
-import { HTTP_HEADERS } from '../../constants.js';
+import { HTTP_HEADERS, ZUBY_USER_AGENTS } from '../../constants.js';
 /**
  * This is internal plugin
  * that pre-renders the pages during the build.
@@ -77,7 +77,7 @@ export default function prerenderPlugin() {
                 const reqBaseUrl = `http://${site || 'localhost'}`;
                 const reqOptions = {
                     headers: {
-                        [HTTP_HEADERS.UserAgent]: 'zuby-prerender',
+                        [HTTP_HEADERS.UserAgent]: ZUBY_USER_AGENTS.Prerenderer,
                     },
                 };
                 // Assign all discovered prerender paths to the config for other plugins.

package/preload/index.d.ts

@@ -0,0 +1,16 @@
+export interface PreloadEntry {
+    href: string;
+    as: string;
+}
+/**
+ * Preloads given link with the lowest priority
+ * in the future when network is idle and DOM loaded.
+ * @example preload("/api/products/1", "json")
+ */
+export declare function preload(href: string, as?: string): void;
+/**
+ * Preloads all required assets for matching page.
+ * Such as scripts, styles, props, etc.
+ * @example preloadPage("/products/1")
+ */
+export declare function preloadPage(href: string, onHandle?: () => void | Promise<void>): void;

package/preload/index.js

@@ -0,0 +1,94 @@
+import { getContext } from '../context/index.js';
+import { PREALOD_MANIFEST } from '../constants.js';
+/**
+ * The set of links that were already preloaded.
+ */
+const preloadLinks = new Set();
+/**
+ * Preload manifest that lists all assets
+ * that should be preloaded for each page.
+ * It is generated by preloadPlugin.
+ * @example {
+ *    "pages/index.tsx": [
+ *      "/chunks/chunk-NGLgOfVh.js",
+ *      "/chunks/chunk-8kxF91T_.css"
+ *    ],
+ * }
+ */
+let preloadManifest;
+/**
+ * Preloads given link with the lowest priority
+ * in the future when network is idle and DOM loaded.
+ * @example preload("/api/products/1", "json")
+ */
+export function preload(href, as = 'fetch') {
+    // Do nothing on server
+    if (typeof window === 'undefined')
+        return;
+    // Preload link only once
+    if (preloadLinks.has(href))
+        return;
+    preloadLinks.add(href);
+    // Detect asset type by extension
+    as = href.match(/\.css(\?.*)?$/) ? 'style' : as;
+    as = href.match(/\.js(\?.*)?$/) ? 'script' : as;
+    // Preload link in the future when network is idle
+    // and DOM content was loaded.
+    window.requestIdleCallback(() => addPreloadEntry({
+        href,
+        as,
+    }));
+}
+/**
+ * Preloads all required assets for matching page.
+ * Such as scripts, styles, props, etc.
+ * @example preloadPage("/products/1")
+ */
+export function preloadPage(href, onHandle = () => { }) {
+    // Do nothing on server
+    if (typeof window === 'undefined')
+        return;
+    const context = getContext();
+    const pages = context.templates?.pages || [];
+    const page = pages.find(({ pathRegex }) => {
+        return pathRegex.test(href);
+    });
+    // Preload link itself
+    // if matching page was not found
+    if (!page) {
+        preload(href);
+        return;
+    }
+    window.requestIdleCallback(async () => {
+        const preloadManifest = await getPreloadManifest();
+        // Preload assets such as scripts and styles
+        const preloadAssets = preloadManifest?.[page.filename] || [];
+        preloadAssets.forEach(href => preload(href));
+        onHandle();
+    });
+}
+/**
+ * Appends preload link into head element of page.
+ * For example:
+ * <link rel="preload" href="/api/products/1" as="json"/>
+ */
+function addPreloadEntry({ href, as }) {
+    const preloadLink = document.createElement('link');
+    preloadLink.href = href;
+    preloadLink.as = as;
+    preloadLink.rel = 'preload';
+    document.head.appendChild(preloadLink);
+}
+/**
+ * Returns preload manifest the way
+ * that ensures it is loaded only once.
+ */
+async function getPreloadManifest() {
+    return (preloadManifest =
+        preloadManifest ||
+            (async () => {
+                const { buildId } = getContext();
+                const res = await fetch(`/${PREALOD_MANIFEST}?${buildId}`);
+                return res.json();
+            })());
+}

package/server/index.js

@@ -875,7 +875,7 @@ function normalizePath(path2) {
 }
 
 // src/server/zubyServer.ts
-import { resolve as resolve3 } from "path";
+import { resolve as resolve3, basename as basename2 } from "path";
 import { createReadStream, existsSync as existsSync2, statSync } from "fs";
 
 // src/server/mimeTypes.ts
@@ -2088,6 +2088,9 @@ var ZubyContext = class {
   get i18n() {
     return this.rawContext.i18n;
   }
+  get buildId() {
+    return this.rawContext.buildId;
+  }
 };
 var getRawContext = () => {
   return globalThis.ZubyRawContext;
@@ -2319,6 +2322,20 @@ var ZubyPageContext = class {
       return path2;
     return `/${locale}/${path2}`.replace(/\/+/g, "/");
   }
+  /**
+   * Returns true if the current request
+   * was made by the Zuby.js pre-render build step.
+   */
+  get isPrerendering() {
+    return this._request?.headers?.get("user-agent") === "zuby-prerender";
+  }
+  /**
+   * The current build ID of the site.
+   * @example ecdf1a94cc9b4f4c
+   */
+  get buildId() {
+    return this._zubyContext.buildId;
+  }
 };
 
 // src/server/zubyRenderer.ts
@@ -8507,7 +8524,8 @@ var BASE_TEMPLATES = {
   innerLayout: "innerLayout",
   app: "app",
   error: "error",
-  entry: "entry"
+  entry: "entry",
+  loader: "loader"
 };
 var TEMPLATES = {
   ...BASE_TEMPLATES,
@@ -8812,6 +8830,9 @@ var ZubyServer = class {
       "Content-Length": fileStats.size.toString(),
       "Last-Modified": fileStats.mtime.toUTCString()
     };
+    if (basename2(file).match(/^(chunk|entry)-/)) {
+      headers["Cache-Control"] = "public, max-age=31536000, immutable";
+    }
     let streamOptions = {
       start: 0,
       end: fileStats.size - 1

package/server/zubyServer.js

@@ -2,7 +2,7 @@ import { createServer as createHttpsServer } from 'node:https';
 import { createServer as createHttpServer } from 'node:http';
 import { readFileSync } from 'node:fs';
 import { normalizePath } from '../utils/pathUtils.js';
-import { resolve } from 'path';
+import { resolve, basename } from 'path';
 import { createReadStream, existsSync, statSync } from 'fs';
 import { mimeTypes } from './mimeTypes.js';
 import { createLogger } from '../logger/index.js';
@@ -76,6 +76,11 @@ export default class ZubyServer {
             'Content-Length': fileStats.size.toString(),
             'Last-Modified': fileStats.mtime.toUTCString(),
         };
+        // Chunks and entry can be cached forever,
+        // because they have a hash in their filename
+        if (basename(file).match(/^(chunk|entry)-/)) {
+            headers['Cache-Control'] = 'public, max-age=31536000, immutable';
+        }
         let streamOptions = {
             start: 0,
             end: fileStats.size - 1,

package/templates/index.d.ts

@@ -23,6 +23,10 @@ export declare function getInnerLayouts(templates?: Template[]): Promise<Templat
  * Returns the array of app templates.
  */
 export declare function getApps(templates?: Template[]): Promise<Template[]>;
+/**
+ * Returns the array of Loader templates.
+ */
+export declare function getLoaders(templates?: Template[]): Promise<Template[]>;
 /**
  * Returns the array of page templates.
  */

package/templates/index.js

@@ -55,6 +55,14 @@ export async function getApps(templates) {
     const apps = await getTemplatesOfType(TEMPLATES.app, templates);
     return [...apps, getDefaultTemplate(jsx.appTemplateFile, TEMPLATES.app)];
 }
+/**
+ * Returns the array of Loader templates.
+ */
+export async function getLoaders(templates) {
+    const { jsx } = await getZubyInternalConfig();
+    const loaders = await getTemplatesOfType(TEMPLATES.loader, templates);
+    return [...loaders, getDefaultTemplate(jsx.loaderTemplateFile, TEMPLATES.loader)];
+}
 /**
  * Returns the array of page templates.
  */

package/templates/types.d.ts

@@ -30,6 +30,7 @@ export declare const BASE_TEMPLATES: {
     app: string;
     error: string;
     entry: string;
+    loader: string;
 };
 export declare const TEMPLATES: {
     page: string;
@@ -40,5 +41,9 @@ export declare const TEMPLATES: {
     app: string;
     error: string;
     entry: string;
+    loader: string;
+};
+export declare const SYNC_TEMPLATES: {
+    loader: string;
 };
 export type TemplateType = (typeof TEMPLATES)[keyof typeof TEMPLATES];

package/templates/types.js

@@ -9,6 +9,7 @@ export const BASE_TEMPLATES = {
     app: 'app',
     error: 'error',
     entry: 'entry',
+    loader: 'loader',
 };
 export const TEMPLATES = {
     ...BASE_TEMPLATES,
@@ -16,3 +17,6 @@ export const TEMPLATES = {
     handler: 'handler',
     markdown: 'markdown',
 };
+export const SYNC_TEMPLATES = {
+    loader: 'loader',
+};

package/types.d.ts

@@ -122,6 +122,11 @@ export interface ZubyConfig {
      * @private
      */
     configFilePath?: string;
+    /**
+     * If you're building in multiple environments,
+     * you can use this option to generate consistent build IDs.
+     */
+    generateBuildId?: () => string | Promise<string>;
 }
 export interface ZubyInternalConfig extends Required<ZubyConfig> {
     /**
@@ -136,6 +141,10 @@ export interface ZubyInternalConfig extends Required<ZubyConfig> {
      * @default []
      */
     plugins: ZubyPlugin[];
+    /**
+     * The current build ID
+     */
+    buildId: string;
 }
 export interface BaseCommandOptions {
     /**
@@ -164,10 +173,27 @@ export interface BuildCommandOptions extends BaseCommandOptions {
 }
 export interface InitCommandOptions {
     /**
-     * The name of the new project.
-     * @default my-zuby-app
+     * The relative path to the project directory.
+     * @example './my-zuby-app'
+     */
+    projectPath?: string;
+    /**
+     * The name of the JSX provider,
+     * a.k.a. the framework you want to use to write your components.
+     * @example 'preact'
+     */
+    jsxProviderName?: string;
+    /**
+     * The name of the example project to use.
+     * @example 'basic'
+     */
+    exampleName?: string;
+    /**
+     * Set this option to true to use TypeScript
+     * for your new project.
+     * @example true
      */
-    projectName?: string;
+    useTypescript?: boolean;
 }
 export interface UpgradeCommandOptions extends BaseCommandOptions {
     /**
@@ -195,6 +221,7 @@ export interface JsxProvider {
     layoutTemplateFile: string;
     innerLayoutTemplateFile: string;
     errorTemplateFile: string;
+    loaderTemplateFile: string;
 }
 export type RenderToString = (vnode: any) => Promise<string> | string;
 export type RenderToStream = (vnode: any) => Promise<ReadableStream> | ReadableStream;
@@ -286,6 +313,14 @@ export interface ZubyPlugin extends VitePlugin {
 export interface ZubyConfigSetupHookParams {
     config: ZubyConfig;
     command: 'dev' | 'build';
+    addEntryTemplate: (entryFile: string) => void;
+    addAppTemplate: (appFile: string, path?: string) => void;
+    addLayoutTemplate: (layoutFile: string, path?: string) => void;
+    addInnerLayoutTemplate: (innerLayoutFile: string, path?: string) => void;
+    addErrorTemplate: (errorFile: string, path?: string) => void;
+    addLoaderTemplate: (loaderFile: string, path?: string) => void;
+    addPage: (pageFile: string, path?: string) => void;
+    addHandler: (handlerFile: string, path?: string) => void;
 }
 export interface ZubyConfigDoneHookParams extends ZubyConfigSetupHookParams {
     config: ZubyInternalConfig;