fix(@angular-devkit/build-angular): several fixes to assets and files writes in browser-esbuild builder

This commit ports #26016 to the esbuilder and also fixes an issue where assets were being outputted in the wrong directory.

Closes #26021

Author: alan-agius4

goldens/circular-deps/packages.json

@@ -3,6 +3,10 @@
     "packages/angular_devkit/build_angular/src/tools/esbuild/bundler-context.ts",
     "packages/angular_devkit/build_angular/src/tools/esbuild/utils.ts"
   ],
+  [
+    "packages/angular_devkit/build_angular/src/tools/esbuild/bundler-execution-result.ts",
+    "packages/angular_devkit/build_angular/src/tools/esbuild/utils.ts"
+  ],
   [
     "packages/angular_devkit/build_angular/src/tools/webpack/utils/stats.ts",
     "packages/angular_devkit/build_angular/src/utils/bundle-calculator.ts"

packages/angular_devkit/build_angular/src/builders/browser-esbuild/index.ts

@@ -12,6 +12,7 @@ import { constants as fsConstants } from 'node:fs';
 import fs from 'node:fs/promises';
 import path from 'node:path';
 import { BuildOutputFile } from '../../tools/esbuild/bundler-context';
+import { BuildOutputAsset } from '../../tools/esbuild/bundler-execution-result';
 import { buildApplicationInternal } from '../application';
 import { Schema as ApplicationBuilderOptions } from '../application/schema';
 import { logBuilderStatusWarnings } from './builder-status-warnings';
@@ -74,36 +75,61 @@ function normalizeOptions(options: BrowserBuilderOptions): ApplicationBuilderOpt
 // and not output browser files into '/browser'.
 async function writeResultFiles(
   outputFiles: BuildOutputFile[],
-  assetFiles: { source: string; destination: string }[] | undefined,
+  assetFiles: BuildOutputAsset[] | undefined,
   outputPath: string,
 ) {
   const directoryExists = new Set<string>();
-  await Promise.all(
-    outputFiles.map(async (file) => {
-      // Ensure output subdirectories exist
-      const basePath = path.dirname(file.path);
-      if (basePath && !directoryExists.has(basePath)) {
-        await fs.mkdir(path.join(outputPath, basePath), { recursive: true });
-        directoryExists.add(basePath);
-      }
-      // Write file contents
-      await fs.writeFile(path.join(outputPath, file.path), file.contents);
-    }),
-  );
+  const ensureDirectoryExists = async (basePath: string) => {
+    if (basePath && !directoryExists.has(basePath)) {
+      await fs.mkdir(path.join(outputPath, basePath), { recursive: true });
+      directoryExists.add(basePath);
+    }
+  };
+
+  // Writes the output file to disk and ensures the containing directories are present
+  await emitFilesToDisk(outputFiles, async (file: BuildOutputFile) => {
+    const fullOutputPath = file.fullOutputPath;
+    // Ensure output subdirectories exist
+    const basePath = path.dirname(fullOutputPath);
+    await ensureDirectoryExists(basePath);
+
+    // Write file contents
+    await fs.writeFile(path.join(outputPath, fullOutputPath), file.contents);
+  });
 
   if (assetFiles?.length) {
-    await Promise.all(
-      assetFiles.map(async ({ source, destination }) => {
-        // Ensure output subdirectories exist
-        const basePath = path.dirname(destination);
-        if (basePath && !directoryExists.has(basePath)) {
-          await fs.mkdir(path.join(outputPath, basePath), { recursive: true });
-          directoryExists.add(basePath);
-        }
-        // Copy file contents
-        await fs.copyFile(source, path.join(outputPath), fsConstants.COPYFILE_FICLONE);
-      }),
-    );
+    await emitFilesToDisk(assetFiles, async (asset: BuildOutputAsset) => {
+      const destination = asset.destination;
+      const basePath = path.dirname(destination);
+
+      // Ensure output subdirectories exist
+      await ensureDirectoryExists(basePath);
+
+      // Copy file contents
+      await fs.copyFile(
+        asset.source,
+        path.join(outputPath, destination),
+        fsConstants.COPYFILE_FICLONE,
+      );
+    });
+  }
+}
+
+const MAX_CONCURRENT_WRITES = 64;
+async function emitFilesToDisk<T = BuildOutputAsset | BuildOutputFile>(
+  files: T[],
+  writeFileCallback: (asset: T) => Promise<void>,
+): Promise<void> {
+  // Write files in groups of MAX_CONCURRENT_WRITES to avoid too many open files
+  for (let fileIndex = 0; fileIndex < files.length; ) {
+    const groupMax = Math.min(fileIndex + MAX_CONCURRENT_WRITES, files.length);
+
+    const actions = [];
+    while (fileIndex < groupMax) {
+      actions.push(writeFileCallback(files[fileIndex++]));
+    }
+
+    await Promise.all(actions);
   }
 }