astro 3.3.4 → 3.4.0

package/dist/@types/astro.d.ts

@@ -16,6 +16,7 @@ import type { TSConfig } from '../core/config/tsconfig.js';
 import type { AstroCookies } from '../core/cookies/index.js';
 import type { ResponseWithEncoding } from '../core/endpoint/index.js';
 import type { AstroIntegrationLogger, Logger, LoggerLevel } from '../core/logger/core.js';
+import type { Icon } from '../runtime/client/dev-overlay/ui-library/icons.js';
 import type { AstroComponentFactory, AstroComponentInstance } from '../runtime/server/index.js';
 import type { OmitIndexSignature, Simplify } from '../type-utils.js';
 import type { SUPPORTED_MARKDOWN_FILE_EXTENSIONS } from './../core/constants.js';
@@ -1252,6 +1253,24 @@ export interface AstroUserConfig {
          * ```
          */
         optimizeHoistedScript?: boolean;
+        /**
+         * @docs
+         * @name experimental.devOverlay
+         * @type {boolean}
+         * @default `false`
+         * @version 3.4.0
+         * @description
+         * Enable a dev overlay in development mode. This overlay allows you to inspect your page islands, see helpful audits on performance and accessibility, and more.
+         *
+         * ```js
+         * {
+         * 	experimental: {
+         * 		devOverlay: true,
+         * 	},
+         * }
+         * ```
+         */
+        devOverlay?: boolean;
     };
 }
 /**
@@ -1402,6 +1421,7 @@ export interface AstroSettings {
      * Map of directive name (e.g. `load`) to the directive script code
      */
     clientDirectives: Map<string, string>;
+    devOverlayPlugins: string[];
     tsConfig: TSConfig | undefined;
     tsConfigPath: string | undefined;
     watchFiles: string[];
@@ -1412,6 +1432,7 @@ export type AsyncRendererComponentFn<U> = (Component: any, props: any, slots: Re
 export interface ComponentInstance {
     default: AstroComponentFactory;
     css?: string[];
+    partial?: boolean;
     prerender?: boolean;
     /**
      * Only used for logging if deprecated drafts feature is used
@@ -1834,6 +1855,7 @@ export interface AstroIntegration {
             injectScript: (stage: InjectedScriptStage, content: string) => void;
             injectRoute: (injectRoute: InjectedRoute) => void;
             addClientDirective: (directive: ClientDirectiveConfig) => void;
+            addDevOverlayPlugin: (entrypoint: string) => void;
             logger: AstroIntegrationLogger;
         }) => void | Promise<void>;
         'astro:config:done'?: (options: {
@@ -1971,6 +1993,7 @@ export interface SSRResult {
      */
     clientDirectives: Map<string, string>;
     compressHTML: boolean;
+    partial: boolean;
     /**
      * Only used for logging
      */
@@ -2026,3 +2049,14 @@ export interface ClientDirectiveConfig {
     name: string;
     entrypoint: string;
 }
+export interface DevOverlayPlugin {
+    id: string;
+    name: string;
+    icon: Icon;
+    init?(canvas: ShadowRoot, eventTarget: EventTarget): void | Promise<void>;
+}
+export type DevOverlayMetadata = Window & typeof globalThis & {
+    __astro_dev_overlay__: {
+        root: string;
+    };
+};

package/dist/assets/build/generate.d.ts

@@ -1,19 +1,23 @@
+import PQueue from 'p-queue';
+import type { AstroConfig } from '../../@types/astro.js';
 import type { BuildPipeline } from '../../core/build/buildPipeline.js';
-import type { ImageTransform } from '../types.js';
-interface GenerationDataUncached {
-    cached: false;
-    weight: {
-        before: number;
-        after: number;
+import type { Logger } from '../../core/logger/core.js';
+import type { MapValue } from '../../type-utils.js';
+import type { AssetsGlobalStaticImagesList } from '../types.js';
+type AssetEnv = {
+    logger: Logger;
+    count: {
+        total: number;
+        current: number;
     };
-}
-interface GenerationDataCached {
-    cached: true;
-}
-type GenerationData = GenerationDataUncached | GenerationDataCached;
-export declare function generateImage(pipeline: BuildPipeline, options: ImageTransform, filepath: string): Promise<GenerationData | undefined>;
-export declare function getStaticImageList(): Map<string, {
-    path: string;
-    options: ImageTransform;
-}>;
+    useCache: boolean;
+    assetsCacheDir: URL;
+    serverRoot: URL;
+    clientRoot: URL;
+    imageConfig: AstroConfig['image'];
+    assetsFolder: AstroConfig['build']['assets'];
+};
+export declare function prepareAssetsGenerationEnv(pipeline: BuildPipeline, totalCount: number): Promise<AssetEnv>;
+export declare function generateImagesForPath(originalFilePath: string, transforms: MapValue<AssetsGlobalStaticImagesList>, env: AssetEnv, queue: PQueue): Promise<void>;
+export declare function getStaticImageList(): AssetsGlobalStaticImagesList;
 export {};

package/dist/assets/build/generate.js

@@ -1,15 +1,19 @@
+import { dim, green } from "kleur/colors";
 import fs, { readFileSync } from "node:fs";
 import { basename, join } from "node:path/posix";
+import PQueue from "p-queue";
 import { getOutDirWithinCwd } from "../../core/build/common.js";
-import { prependForwardSlash } from "../../core/path.js";
+import { getTimeStat } from "../../core/build/util.js";
+import { isRemotePath, prependForwardSlash } from "../../core/path.js";
 import { isServerLikeOutput } from "../../prerender/utils.js";
 import { getConfiguredImageService, isESMImportedImage } from "../internal.js";
 import { loadRemoteImage } from "./remote.js";
-async function generateImage(pipeline, options, filepath) {
+async function prepareAssetsGenerationEnv(pipeline, totalCount) {
   const config = pipeline.getConfig();
   const logger = pipeline.getLogger();
   let useCache = true;
   const assetsCacheDir = new URL("assets/", config.cacheDir);
+  const count = { total: totalCount, current: 1 };
   try {
     await fs.promises.mkdir(assetsCacheDir, { recursive: true });
   } catch (err) {
@@ -27,82 +31,115 @@ async function generateImage(pipeline, options, filepath) {
     serverRoot = getOutDirWithinCwd(config.outDir);
     clientRoot = config.outDir;
   }
-  const isLocalImage = isESMImportedImage(options.src);
-  const finalFileURL = new URL("." + filepath, clientRoot);
-  const finalFolderURL = new URL("./", finalFileURL);
-  const cacheFile = basename(filepath) + (isLocalImage ? "" : ".json");
-  const cachedFileURL = new URL(cacheFile, assetsCacheDir);
-  await fs.promises.mkdir(finalFolderURL, { recursive: true });
-  try {
-    if (isLocalImage) {
-      await fs.promises.copyFile(cachedFileURL, finalFileURL);
-      return {
-        cached: true
-      };
-    } else {
-      const JSONData = JSON.parse(readFileSync(cachedFileURL, "utf-8"));
-      if (JSONData.expires > Date.now()) {
-        await fs.promises.writeFile(finalFileURL, Buffer.from(JSONData.data, "base64"));
-        return {
-          cached: true
-        };
-      }
-    }
-  } catch (e) {
-    if (e.code !== "ENOENT") {
-      throw new Error(`An error was encountered while reading the cache file. Error: ${e}`);
-    }
-  }
-  const originalImagePath = isLocalImage ? options.src.src : options.src;
-  let imageData;
-  let resultData = {
-    data: void 0,
-    expires: void 0
+  return {
+    logger,
+    count,
+    useCache,
+    assetsCacheDir,
+    serverRoot,
+    clientRoot,
+    imageConfig: config.image,
+    assetsFolder: config.build.assets
   };
-  if (isLocalImage) {
-    imageData = await fs.promises.readFile(
-      new URL(
-        "." + prependForwardSlash(join(config.build.assets, basename(originalImagePath))),
-        serverRoot
-      )
+}
+async function generateImagesForPath(originalFilePath, transforms, env, queue) {
+  const originalImageData = await loadImage(originalFilePath, env);
+  for (const [_, transform] of transforms) {
+    queue.add(
+      async () => generateImage(originalImageData, transform.finalPath, transform.transform)
     );
-  } else {
-    const remoteImage = await loadRemoteImage(originalImagePath);
-    resultData.expires = remoteImage.expires;
-    imageData = remoteImage.data;
   }
-  const imageService = await getConfiguredImageService();
-  resultData.data = (await imageService.transform(imageData, { ...options, src: originalImagePath }, config.image)).data;
-  try {
-    if (useCache) {
+  async function generateImage(originalImage, filepath, options) {
+    const timeStart = performance.now();
+    const generationData = await generateImageInternal(originalImage, filepath, options);
+    const timeEnd = performance.now();
+    const timeChange = getTimeStat(timeStart, timeEnd);
+    const timeIncrease = `(+${timeChange})`;
+    const statsText = generationData.cached ? `(reused cache entry)` : `(before: ${generationData.weight.before}kB, after: ${generationData.weight.after}kB)`;
+    const count = `(${env.count.current}/${env.count.total})`;
+    env.logger.info(
+      null,
+      `  ${green("\u25B6")} ${filepath} ${dim(statsText)} ${dim(timeIncrease)} ${dim(count)}`
+    );
+    env.count.current++;
+  }
+  async function generateImageInternal(originalImage, filepath, options) {
+    const isLocalImage = isESMImportedImage(options.src);
+    const finalFileURL = new URL("." + filepath, env.clientRoot);
+    const cacheFile = basename(filepath) + (isLocalImage ? "" : ".json");
+    const cachedFileURL = new URL(cacheFile, env.assetsCacheDir);
+    try {
       if (isLocalImage) {
-        await fs.promises.writeFile(cachedFileURL, resultData.data);
+        await fs.promises.copyFile(cachedFileURL, finalFileURL, fs.constants.COPYFILE_FICLONE);
+        return {
+          cached: true
+        };
       } else {
-        await fs.promises.writeFile(
-          cachedFileURL,
-          JSON.stringify({
-            data: Buffer.from(resultData.data).toString("base64"),
-            expires: resultData.expires
-          })
-        );
+        const JSONData = JSON.parse(readFileSync(cachedFileURL, "utf-8"));
+        if (!JSONData.data || !JSONData.expires) {
+          await fs.promises.unlink(cachedFileURL);
+          throw new Error(
+            `Malformed cache entry for ${filepath}, cache will be regenerated for this file.`
+          );
+        }
+        if (JSONData.expires > Date.now()) {
+          await fs.promises.writeFile(finalFileURL, Buffer.from(JSONData.data, "base64"));
+          return {
+            cached: true
+          };
+        } else {
+          await fs.promises.unlink(cachedFileURL);
+        }
+      }
+    } catch (e) {
+      if (e.code !== "ENOENT") {
+        throw new Error(`An error was encountered while reading the cache file. Error: ${e}`);
       }
     }
-  } catch (e) {
-    logger.warn(
-      "astro:assets",
-      `An error was encountered while creating the cache directory. Proceeding without caching. Error: ${e}`
-    );
-  } finally {
-    await fs.promises.writeFile(finalFileURL, resultData.data);
-  }
-  return {
-    cached: false,
-    weight: {
-      // Divide by 1024 to get size in kilobytes
-      before: Math.trunc(imageData.byteLength / 1024),
-      after: Math.trunc(Buffer.from(resultData.data).byteLength / 1024)
+    const finalFolderURL = new URL("./", finalFileURL);
+    await fs.promises.mkdir(finalFolderURL, { recursive: true });
+    const originalImagePath = isLocalImage ? options.src.src : options.src;
+    let resultData = {
+      data: void 0,
+      expires: originalImage.expires
+    };
+    const imageService = await getConfiguredImageService();
+    resultData.data = (await imageService.transform(
+      originalImage.data,
+      { ...options, src: originalImagePath },
+      env.imageConfig
+    )).data;
+    try {
+      if (env.useCache) {
+        if (isLocalImage) {
+          await fs.promises.writeFile(cachedFileURL, resultData.data);
+        } else {
+          await fs.promises.writeFile(
+            cachedFileURL,
+            JSON.stringify({
+              data: Buffer.from(resultData.data).toString("base64"),
+              expires: resultData.expires
+            })
+          );
+        }
+      }
+    } catch (e) {
+      env.logger.warn(
+        "astro:assets",
+        `An error was encountered while creating the cache directory. Proceeding without caching. Error: ${e}`
+      );
+    } finally {
+      await fs.promises.writeFile(finalFileURL, resultData.data);
     }
-  };
+    return {
+      cached: false,
+      weight: {
+        // Divide by 1024 to get size in kilobytes
+        before: Math.trunc(originalImage.data.byteLength / 1024),
+        after: Math.trunc(Buffer.from(resultData.data).byteLength / 1024)
+      }
+    };
+  }
 }
 function getStaticImageList() {
   if (!globalThis?.astroAsset?.staticImages) {
@@ -110,7 +147,23 @@ function getStaticImageList() {
   }
   return globalThis.astroAsset.staticImages;
 }
+async function loadImage(path, env) {
+  if (isRemotePath(path)) {
+    const remoteImage = await loadRemoteImage(path);
+    return {
+      data: remoteImage.data,
+      expires: remoteImage.expires
+    };
+  }
+  return {
+    data: await fs.promises.readFile(
+      new URL("." + prependForwardSlash(join(env.assetsFolder, basename(path))), env.serverRoot)
+    ),
+    expires: 0
+  };
+}
 export {
-  generateImage,
-  getStaticImageList
+  generateImagesForPath,
+  getStaticImageList,
+  prepareAssetsGenerationEnv
 };

package/dist/assets/types.d.ts

@@ -5,14 +5,15 @@ export type ImageQualityPreset = 'low' | 'mid' | 'high' | 'max' | (string & {});
 export type ImageQuality = ImageQualityPreset | number;
 export type ImageInputFormat = (typeof VALID_INPUT_FORMATS)[number];
 export type ImageOutputFormat = (typeof VALID_OUTPUT_FORMATS)[number] | (string & {});
+export type AssetsGlobalStaticImagesList = Map<string, Map<string, {
+    finalPath: string;
+    transform: ImageTransform;
+}>>;
 declare global {
     var astroAsset: {
         imageService?: ImageService;
         addStaticImage?: ((options: ImageTransform) => string) | undefined;
-        staticImages?: Map<string, {
-            path: string;
-            options: ImageTransform;
-        }>;
+        staticImages?: AssetsGlobalStaticImagesList;
     };
 }
 /**

package/dist/assets/vite-plugin-assets.js

@@ -10,6 +10,7 @@ import {
 } from "../core/path.js";
 import { isServerLikeOutput } from "../prerender/utils.js";
 import { VALID_INPUT_FORMATS, VIRTUAL_MODULE_ID, VIRTUAL_SERVICE_ID } from "./consts.js";
+import { isESMImportedImage } from "./internal.js";
 import { emitESMImage } from "./utils/emitAsset.js";
 import { hashTransform, propsToFilename } from "./utils/transformToPath.js";
 const resolvedVirtualModuleId = "\0" + VIRTUAL_MODULE_ID;
@@ -67,20 +68,27 @@ function assets({
           if (!globalThis.astroAsset.staticImages) {
             globalThis.astroAsset.staticImages = /* @__PURE__ */ new Map();
           }
+          const originalImagePath = (isESMImportedImage(options.src) ? options.src.src : options.src).replace(settings.config.build.assetsPrefix || "", "");
           const hash = hashTransform(options, settings.config.image.service.entrypoint);
-          let filePath;
-          if (globalThis.astroAsset.staticImages.has(hash)) {
-            filePath = globalThis.astroAsset.staticImages.get(hash).path;
+          let finalFilePath;
+          let transformsForPath = globalThis.astroAsset.staticImages.get(originalImagePath);
+          let transformForHash = transformsForPath?.get(hash);
+          if (transformsForPath && transformForHash) {
+            finalFilePath = transformForHash.finalPath;
           } else {
-            filePath = prependForwardSlash(
+            finalFilePath = prependForwardSlash(
               joinPaths(settings.config.build.assets, propsToFilename(options, hash))
             );
-            globalThis.astroAsset.staticImages.set(hash, { path: filePath, options });
+            if (!transformsForPath) {
+              globalThis.astroAsset.staticImages.set(originalImagePath, /* @__PURE__ */ new Map());
+              transformsForPath = globalThis.astroAsset.staticImages.get(originalImagePath);
+            }
+            transformsForPath.set(hash, { finalPath: finalFilePath, transform: options });
           }
           if (settings.config.build.assetsPrefix) {
-            return joinPaths(settings.config.build.assetsPrefix, filePath);
+            return joinPaths(settings.config.build.assetsPrefix, finalFilePath);
           } else {
-            return prependForwardSlash(joinPaths(settings.config.base, filePath));
+            return prependForwardSlash(joinPaths(settings.config.base, finalFilePath));
           }
         };
       },

package/dist/cli/add/babel.d.ts

@@ -11,7 +11,7 @@ export declare const visit: {
     node: (node: traverse.Node, opts: traverse.TraverseOptions<traverse.Node>, scope?: traverse.Scope | undefined, state?: any, path?: traverse.NodePath<traverse.Node> | undefined, skipKeys?: Record<string, boolean> | undefined) => void;
     clearNode: (node: traverse.Node, opts?: traverse.RemovePropertiesOptions | undefined) => void;
     removeProperties: (tree: traverse.Node, opts?: traverse.RemovePropertiesOptions | undefined) => traverse.Node;
-    hasType: (tree: traverse.Node, type: "CatchClause" | "ClassBody" | "Identifier" | "Program" | "SpreadElement" | "Super" | "SwitchCase" | "TemplateElement" | "VariableDeclarator" | "ArrayExpression" | "ArrowFunctionExpression" | "AssignmentExpression" | "AwaitExpression" | "BinaryExpression" | "CallExpression" | "ClassExpression" | "ConditionalExpression" | "FunctionExpression" | "LogicalExpression" | "MemberExpression" | "MetaProperty" | "NewExpression" | "ObjectExpression" | "SequenceExpression" | "TaggedTemplateExpression" | "TemplateLiteral" | "ThisExpression" | "UnaryExpression" | "UpdateExpression" | "YieldExpression" | "AnyTypeAnnotation" | "ArgumentPlaceholder" | "ArrayPattern" | "ArrayTypeAnnotation" | "AssignmentPattern" | "BigIntLiteral" | "BindExpression" | "BlockStatement" | "BooleanLiteral" | "BooleanLiteralTypeAnnotation" | "BooleanTypeAnnotation" | "BreakStatement" | "ClassAccessorProperty" | "ClassDeclaration" | "ClassImplements" | "ClassMethod" | "ClassPrivateMethod" | "ClassPrivateProperty" | "ClassProperty" | "ContinueStatement" | "DebuggerStatement" | "DecimalLiteral" | "DeclareClass" | "DeclareExportAllDeclaration" | "DeclareExportDeclaration" | "DeclareFunction" | "DeclareInterface" | "DeclareModule" | "DeclareModuleExports" | "DeclareOpaqueType" | "DeclareTypeAlias" | "DeclareVariable" | "DeclaredPredicate" | "Decorator" | "Directive" | "DirectiveLiteral" | "DoExpression" | "DoWhileStatement" | "EmptyStatement" | "EmptyTypeAnnotation" | "EnumBooleanBody" | "EnumBooleanMember" | "EnumDeclaration" | "EnumDefaultedMember" | "EnumNumberBody" | "EnumNumberMember" | "EnumStringBody" | "EnumStringMember" | "EnumSymbolBody" | "ExistsTypeAnnotation" | "ExportAllDeclaration" | "ExportDefaultDeclaration" | "ExportDefaultSpecifier" | "ExportNamedDeclaration" | "ExportNamespaceSpecifier" | "ExportSpecifier" | "ExpressionStatement" | "File" | "ForInStatement" | "ForOfStatement" | "ForStatement" | "FunctionDeclaration" | "FunctionTypeAnnotation" | "FunctionTypeParam" | "GenericTypeAnnotation" | "IfStatement" | "Import" | "ImportAttribute" | "ImportDeclaration" | "ImportDefaultSpecifier" | "ImportNamespaceSpecifier" | "ImportSpecifier" | "IndexedAccessType" | "InferredPredicate" | "InterfaceDeclaration" | "InterfaceExtends" | "InterfaceTypeAnnotation" | "InterpreterDirective" | "IntersectionTypeAnnotation" | "JSXAttribute" | "JSXClosingElement" | "JSXClosingFragment" | "JSXElement" | "JSXEmptyExpression" | "JSXExpressionContainer" | "JSXFragment" | "JSXIdentifier" | "JSXMemberExpression" | "JSXNamespacedName" | "JSXOpeningElement" | "JSXOpeningFragment" | "JSXSpreadAttribute" | "JSXSpreadChild" | "JSXText" | "LabeledStatement" | "MixedTypeAnnotation" | "ModuleExpression" | "Noop" | "NullLiteral" | "NullLiteralTypeAnnotation" | "NullableTypeAnnotation" | "NumberLiteral" | "NumberLiteralTypeAnnotation" | "NumberTypeAnnotation" | "NumericLiteral" | "ObjectMethod" | "ObjectPattern" | "ObjectProperty" | "ObjectTypeAnnotation" | "ObjectTypeCallProperty" | "ObjectTypeIndexer" | "ObjectTypeInternalSlot" | "ObjectTypeProperty" | "ObjectTypeSpreadProperty" | "OpaqueType" | "OptionalCallExpression" | "OptionalIndexedAccessType" | "OptionalMemberExpression" | "ParenthesizedExpression" | "PipelineBareFunction" | "PipelinePrimaryTopicReference" | "PipelineTopicExpression" | "Placeholder" | "PrivateName" | "QualifiedTypeIdentifier" | "RecordExpression" | "RegExpLiteral" | "RegexLiteral" | "RestElement" | "RestProperty" | "ReturnStatement" | "SpreadProperty" | "StaticBlock" | "StringLiteral" | "StringLiteralTypeAnnotation" | "StringTypeAnnotation" | "SwitchStatement" | "SymbolTypeAnnotation" | "TSAnyKeyword" | "TSArrayType" | "TSAsExpression" | "TSBigIntKeyword" | "TSBooleanKeyword" | "TSCallSignatureDeclaration" | "TSConditionalType" | "TSConstructSignatureDeclaration" | "TSConstructorType" | "TSDeclareFunction" | "TSDeclareMethod" | "TSEnumDeclaration" | "TSEnumMember" | "TSExportAssignment" | "TSExpressionWithTypeArguments" | "TSExternalModuleReference" | "TSFunctionType" | "TSImportEqualsDeclaration" | "TSImportType" | "TSIndexSignature" | "TSIndexedAccessType" | "TSInferType" | "TSInstantiationExpression" | "TSInterfaceBody" | "TSInterfaceDeclaration" | "TSIntersectionType" | "TSIntrinsicKeyword" | "TSLiteralType" | "TSMappedType" | "TSMethodSignature" | "TSModuleBlock" | "TSModuleDeclaration" | "TSNamedTupleMember" | "TSNamespaceExportDeclaration" | "TSNeverKeyword" | "TSNonNullExpression" | "TSNullKeyword" | "TSNumberKeyword" | "TSObjectKeyword" | "TSOptionalType" | "TSParameterProperty" | "TSParenthesizedType" | "TSPropertySignature" | "TSQualifiedName" | "TSRestType" | "TSSatisfiesExpression" | "TSStringKeyword" | "TSSymbolKeyword" | "TSThisType" | "TSTupleType" | "TSTypeAliasDeclaration" | "TSTypeAnnotation" | "TSTypeAssertion" | "TSTypeLiteral" | "TSTypeOperator" | "TSTypeParameter" | "TSTypeParameterDeclaration" | "TSTypeParameterInstantiation" | "TSTypePredicate" | "TSTypeQuery" | "TSTypeReference" | "TSUndefinedKeyword" | "TSUnionType" | "TSUnknownKeyword" | "TSVoidKeyword" | "ThisTypeAnnotation" | "ThrowStatement" | "TopicReference" | "TryStatement" | "TupleExpression" | "TupleTypeAnnotation" | "TypeAlias" | "TypeAnnotation" | "TypeCastExpression" | "TypeParameter" | "TypeParameterDeclaration" | "TypeParameterInstantiation" | "TypeofTypeAnnotation" | "UnionTypeAnnotation" | "V8IntrinsicIdentifier" | "VariableDeclaration" | "Variance" | "VoidTypeAnnotation" | "WhileStatement" | "WithStatement", denylistTypes?: string[] | undefined) => boolean;
+    hasType: (tree: traverse.Node, type: "CatchClause" | "ClassBody" | "Identifier" | "Program" | "SpreadElement" | "Super" | "SwitchCase" | "TemplateElement" | "VariableDeclarator" | "ArrayExpression" | "ArrowFunctionExpression" | "AssignmentExpression" | "AwaitExpression" | "BinaryExpression" | "CallExpression" | "ClassExpression" | "ConditionalExpression" | "FunctionExpression" | "ImportExpression" | "LogicalExpression" | "MemberExpression" | "MetaProperty" | "NewExpression" | "ObjectExpression" | "SequenceExpression" | "TaggedTemplateExpression" | "TemplateLiteral" | "ThisExpression" | "UnaryExpression" | "UpdateExpression" | "YieldExpression" | "AnyTypeAnnotation" | "ArgumentPlaceholder" | "ArrayPattern" | "ArrayTypeAnnotation" | "AssignmentPattern" | "BigIntLiteral" | "BindExpression" | "BlockStatement" | "BooleanLiteral" | "BooleanLiteralTypeAnnotation" | "BooleanTypeAnnotation" | "BreakStatement" | "ClassAccessorProperty" | "ClassDeclaration" | "ClassImplements" | "ClassMethod" | "ClassPrivateMethod" | "ClassPrivateProperty" | "ClassProperty" | "ContinueStatement" | "DebuggerStatement" | "DecimalLiteral" | "DeclareClass" | "DeclareExportAllDeclaration" | "DeclareExportDeclaration" | "DeclareFunction" | "DeclareInterface" | "DeclareModule" | "DeclareModuleExports" | "DeclareOpaqueType" | "DeclareTypeAlias" | "DeclareVariable" | "DeclaredPredicate" | "Decorator" | "Directive" | "DirectiveLiteral" | "DoExpression" | "DoWhileStatement" | "EmptyStatement" | "EmptyTypeAnnotation" | "EnumBooleanBody" | "EnumBooleanMember" | "EnumDeclaration" | "EnumDefaultedMember" | "EnumNumberBody" | "EnumNumberMember" | "EnumStringBody" | "EnumStringMember" | "EnumSymbolBody" | "ExistsTypeAnnotation" | "ExportAllDeclaration" | "ExportDefaultDeclaration" | "ExportDefaultSpecifier" | "ExportNamedDeclaration" | "ExportNamespaceSpecifier" | "ExportSpecifier" | "ExpressionStatement" | "File" | "ForInStatement" | "ForOfStatement" | "ForStatement" | "FunctionDeclaration" | "FunctionTypeAnnotation" | "FunctionTypeParam" | "GenericTypeAnnotation" | "IfStatement" | "Import" | "ImportAttribute" | "ImportDeclaration" | "ImportDefaultSpecifier" | "ImportNamespaceSpecifier" | "ImportSpecifier" | "IndexedAccessType" | "InferredPredicate" | "InterfaceDeclaration" | "InterfaceExtends" | "InterfaceTypeAnnotation" | "InterpreterDirective" | "IntersectionTypeAnnotation" | "JSXAttribute" | "JSXClosingElement" | "JSXClosingFragment" | "JSXElement" | "JSXEmptyExpression" | "JSXExpressionContainer" | "JSXFragment" | "JSXIdentifier" | "JSXMemberExpression" | "JSXNamespacedName" | "JSXOpeningElement" | "JSXOpeningFragment" | "JSXSpreadAttribute" | "JSXSpreadChild" | "JSXText" | "LabeledStatement" | "MixedTypeAnnotation" | "ModuleExpression" | "Noop" | "NullLiteral" | "NullLiteralTypeAnnotation" | "NullableTypeAnnotation" | "NumberLiteral" | "NumberLiteralTypeAnnotation" | "NumberTypeAnnotation" | "NumericLiteral" | "ObjectMethod" | "ObjectPattern" | "ObjectProperty" | "ObjectTypeAnnotation" | "ObjectTypeCallProperty" | "ObjectTypeIndexer" | "ObjectTypeInternalSlot" | "ObjectTypeProperty" | "ObjectTypeSpreadProperty" | "OpaqueType" | "OptionalCallExpression" | "OptionalIndexedAccessType" | "OptionalMemberExpression" | "ParenthesizedExpression" | "PipelineBareFunction" | "PipelinePrimaryTopicReference" | "PipelineTopicExpression" | "Placeholder" | "PrivateName" | "QualifiedTypeIdentifier" | "RecordExpression" | "RegExpLiteral" | "RegexLiteral" | "RestElement" | "RestProperty" | "ReturnStatement" | "SpreadProperty" | "StaticBlock" | "StringLiteral" | "StringLiteralTypeAnnotation" | "StringTypeAnnotation" | "SwitchStatement" | "SymbolTypeAnnotation" | "TSAnyKeyword" | "TSArrayType" | "TSAsExpression" | "TSBigIntKeyword" | "TSBooleanKeyword" | "TSCallSignatureDeclaration" | "TSConditionalType" | "TSConstructSignatureDeclaration" | "TSConstructorType" | "TSDeclareFunction" | "TSDeclareMethod" | "TSEnumDeclaration" | "TSEnumMember" | "TSExportAssignment" | "TSExpressionWithTypeArguments" | "TSExternalModuleReference" | "TSFunctionType" | "TSImportEqualsDeclaration" | "TSImportType" | "TSIndexSignature" | "TSIndexedAccessType" | "TSInferType" | "TSInstantiationExpression" | "TSInterfaceBody" | "TSInterfaceDeclaration" | "TSIntersectionType" | "TSIntrinsicKeyword" | "TSLiteralType" | "TSMappedType" | "TSMethodSignature" | "TSModuleBlock" | "TSModuleDeclaration" | "TSNamedTupleMember" | "TSNamespaceExportDeclaration" | "TSNeverKeyword" | "TSNonNullExpression" | "TSNullKeyword" | "TSNumberKeyword" | "TSObjectKeyword" | "TSOptionalType" | "TSParameterProperty" | "TSParenthesizedType" | "TSPropertySignature" | "TSQualifiedName" | "TSRestType" | "TSSatisfiesExpression" | "TSStringKeyword" | "TSSymbolKeyword" | "TSThisType" | "TSTupleType" | "TSTypeAliasDeclaration" | "TSTypeAnnotation" | "TSTypeAssertion" | "TSTypeLiteral" | "TSTypeOperator" | "TSTypeParameter" | "TSTypeParameterDeclaration" | "TSTypeParameterInstantiation" | "TSTypePredicate" | "TSTypeQuery" | "TSTypeReference" | "TSUndefinedKeyword" | "TSUnionType" | "TSUnknownKeyword" | "TSVoidKeyword" | "ThisTypeAnnotation" | "ThrowStatement" | "TopicReference" | "TryStatement" | "TupleExpression" | "TupleTypeAnnotation" | "TypeAlias" | "TypeAnnotation" | "TypeCastExpression" | "TypeParameter" | "TypeParameterDeclaration" | "TypeParameterInstantiation" | "TypeofTypeAnnotation" | "UnionTypeAnnotation" | "V8IntrinsicIdentifier" | "VariableDeclaration" | "Variance" | "VoidTypeAnnotation" | "WhileStatement" | "WithStatement", denylistTypes?: string[] | undefined) => boolean;
     cache: typeof traverse.cache;
 };
 export { t };

package/dist/core/build/generate.js

@@ -1,10 +1,13 @@
 import * as colors from "kleur/colors";
 import { bgGreen, black, cyan, dim, green, magenta } from "kleur/colors";
 import fs from "node:fs";
+import os from "node:os";
 import { fileURLToPath } from "node:url";
+import PQueue from "p-queue";
 import {
-  generateImage as generateImageInternal,
-  getStaticImageList
+  generateImagesForPath,
+  getStaticImageList,
+  prepareAssetsGenerationEnv
 } from "../../assets/build/generate.js";
 import { hasPrerenderedPages } from "../../core/build/internal.js";
 import {
@@ -145,45 +148,30 @@ ${bgGreen(black(` ${verb} static routes `))}`);
       }
     }
   }
+  logger.info(null, dim(`Completed in ${getTimeStat(timer, performance.now())}.
+`));
   const staticImageList = getStaticImageList();
-  if (staticImageList.size)
+  if (staticImageList.size) {
     logger.info(null, `
 ${bgGreen(black(` generating optimized images `))}`);
-  let count = 0;
-  for (const imageData of staticImageList.entries()) {
-    count++;
-    await generateImage(
-      pipeline,
-      imageData[1].options,
-      imageData[1].path,
-      count,
-      staticImageList.size
-    );
+    const totalCount = Array.from(staticImageList.values()).map((x) => x.size).reduce((a, b) => a + b, 0);
+    const cpuCount = os.cpus().length;
+    const assetsCreationEnvironment = await prepareAssetsGenerationEnv(pipeline, totalCount);
+    const queue = new PQueue({ concurrency: cpuCount });
+    const assetsTimer = performance.now();
+    for (const [originalPath, transforms] of staticImageList) {
+      await generateImagesForPath(originalPath, transforms, assetsCreationEnvironment, queue);
+    }
+    await queue.onIdle();
+    const assetsTimeEnd = performance.now();
+    logger.info(null, dim(`Completed in ${getTimeStat(assetsTimer, assetsTimeEnd)}.
+`));
+    delete globalThis?.astroAsset?.addStaticImage;
   }
-  delete globalThis?.astroAsset?.addStaticImage;
   await runHookBuildGenerated({
     config: opts.settings.config,
     logger: pipeline.getLogger()
   });
-  logger.info(null, dim(`Completed in ${getTimeStat(timer, performance.now())}.
-`));
-}
-async function generateImage(pipeline, transform, path, count, totalCount) {
-  const logger = pipeline.getLogger();
-  let timeStart = performance.now();
-  const generationData = await generateImageInternal(pipeline, transform, path);
-  if (!generationData) {
-    return;
-  }
-  const timeEnd = performance.now();
-  const timeChange = getTimeStat(timeStart, timeEnd);
-  const timeIncrease = `(+${timeChange})`;
-  const statsText = generationData.cached ? `(reused cache entry)` : `(before: ${generationData.weight.before}kB, after: ${generationData.weight.after}kB)`;
-  const counter = `(${count}/${totalCount})`;
-  logger.info(
-    null,
-    `  ${green("\u25B6")} ${path} ${dim(statsText)} ${dim(timeIncrease)} ${dim(counter)}`
-  );
 }
 async function generatePage(pageData, ssrEntry, builtPaths, pipeline) {
   let timeStart = performance.now();

package/dist/core/config/schema.d.ts

@@ -228,10 +228,13 @@ export declare const AstroConfigSchema: z.ZodObject<{
     vite: z.ZodDefault<z.ZodType<ViteUserConfig, z.ZodTypeDef, ViteUserConfig>>;
     experimental: z.ZodDefault<z.ZodObject<{
         optimizeHoistedScript: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
+        devOverlay: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
     }, "strict", z.ZodTypeAny, {
         optimizeHoistedScript: boolean;
+        devOverlay: boolean;
     }, {
         optimizeHoistedScript?: boolean | undefined;
+        devOverlay?: boolean | undefined;
     }>>;
     legacy: z.ZodDefault<z.ZodObject<{}, "strip", z.ZodTypeAny, {}, {}>>;
 }, "strip", z.ZodTypeAny, {
@@ -307,6 +310,7 @@ export declare const AstroConfigSchema: z.ZodObject<{
     vite: ViteUserConfig;
     experimental: {
         optimizeHoistedScript: boolean;
+        devOverlay: boolean;
     };
     legacy: {};
 }, {
@@ -376,6 +380,7 @@ export declare const AstroConfigSchema: z.ZodObject<{
     vite?: ViteUserConfig | undefined;
     experimental?: {
         optimizeHoistedScript?: boolean | undefined;
+        devOverlay?: boolean | undefined;
     } | undefined;
     legacy?: {} | undefined;
 }>;
@@ -534,10 +539,13 @@ export declare function createRelativeSchema(cmd: string, fileProtocolRoot: stri
     vite: z.ZodDefault<z.ZodType<ViteUserConfig, z.ZodTypeDef, ViteUserConfig>>;
     experimental: z.ZodDefault<z.ZodObject<{
         optimizeHoistedScript: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
+        devOverlay: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
     }, "strict", z.ZodTypeAny, {
         optimizeHoistedScript: boolean;
+        devOverlay: boolean;
     }, {
         optimizeHoistedScript?: boolean | undefined;
+        devOverlay?: boolean | undefined;
     }>>;
     legacy: z.ZodDefault<z.ZodObject<{}, "strip", z.ZodTypeAny, {}, {}>>;
     root: z.ZodEffects<z.ZodDefault<z.ZodString>, import("url").URL, string | undefined>;
@@ -679,6 +687,7 @@ export declare function createRelativeSchema(cmd: string, fileProtocolRoot: stri
     vite: ViteUserConfig;
     experimental: {
         optimizeHoistedScript: boolean;
+        devOverlay: boolean;
     };
     legacy: {};
 }, {
@@ -748,6 +757,7 @@ export declare function createRelativeSchema(cmd: string, fileProtocolRoot: stri
     vite?: ViteUserConfig | undefined;
     experimental?: {
         optimizeHoistedScript?: boolean | undefined;
+        devOverlay?: boolean | undefined;
     } | undefined;
     legacy?: {} | undefined;
 }>, {
@@ -824,6 +834,7 @@ export declare function createRelativeSchema(cmd: string, fileProtocolRoot: stri
     vite: ViteUserConfig;
     experimental: {
         optimizeHoistedScript: boolean;
+        devOverlay: boolean;
     };
     legacy: {};
 }, {
@@ -893,6 +904,7 @@ export declare function createRelativeSchema(cmd: string, fileProtocolRoot: stri
     vite?: ViteUserConfig | undefined;
     experimental?: {
         optimizeHoistedScript?: boolean | undefined;
+        devOverlay?: boolean | undefined;
     } | undefined;
     legacy?: {} | undefined;
 }>, {
@@ -969,6 +981,7 @@ export declare function createRelativeSchema(cmd: string, fileProtocolRoot: stri
     vite: ViteUserConfig;
     experimental: {
         optimizeHoistedScript: boolean;
+        devOverlay: boolean;
     };
     legacy: {};
 }, {
@@ -1038,6 +1051,7 @@ export declare function createRelativeSchema(cmd: string, fileProtocolRoot: stri
     vite?: ViteUserConfig | undefined;
     experimental?: {
         optimizeHoistedScript?: boolean | undefined;
+        devOverlay?: boolean | undefined;
     } | undefined;
     legacy?: {} | undefined;
 }>;

package/dist/core/config/schema.js

@@ -41,7 +41,8 @@ const ASTRO_CONFIG_DEFAULTS = {
   legacy: {},
   redirects: {},
   experimental: {
-    optimizeHoistedScript: false
+    optimizeHoistedScript: false,
+    devOverlay: false
   }
 };
 const AstroConfigSchema = z.object({
@@ -179,7 +180,8 @@ const AstroConfigSchema = z.object({
   }).default({}),
   vite: z.custom((data) => data instanceof Object && !Array.isArray(data)).default(ASTRO_CONFIG_DEFAULTS.vite),
   experimental: z.object({
-    optimizeHoistedScript: z.boolean().optional().default(ASTRO_CONFIG_DEFAULTS.experimental.optimizeHoistedScript)
+    optimizeHoistedScript: z.boolean().optional().default(ASTRO_CONFIG_DEFAULTS.experimental.optimizeHoistedScript),
+    devOverlay: z.boolean().optional().default(ASTRO_CONFIG_DEFAULTS.experimental.devOverlay)
   }).strict(
     `Invalid or outdated experimental feature.
 Check for incorrect spelling or outdated Astro version.

package/dist/core/config/settings.js

@@ -87,6 +87,7 @@ function createBaseSettings(config) {
     scripts: [],
     clientDirectives: getDefaultClientDirectives(),
     watchFiles: [],
+    devOverlayPlugins: [],
     timer: new AstroTimer()
   };
 }

package/dist/core/constants.js

@@ -1,4 +1,4 @@
-const ASTRO_VERSION = "3.3.4";
+const ASTRO_VERSION = "3.4.0";
 const SUPPORTED_MARKDOWN_FILE_EXTENSIONS = [
   ".markdown",
   ".mdown",