fix(@angular/ssr): avoid preloading unnecessary dynamic bundles

packages/angular/build/src/utils/server-rendering/manifest.ts

@@ -201,34 +201,22 @@ function generateLazyLoadedFilesMappings(
   metafile: Metafile,
   initialFiles: Set<string>,
   publicPath = '',
-): Record<string, FilesMapping[]> {
-  const entryPointToBundles: Record<string, FilesMapping[]> = {};
+): Record<string, string[]> {
+  const entryPointToBundles: Record<string, string[]> = {};
   for (const [fileName, { entryPoint, exports, imports }] of Object.entries(metafile.outputs)) {
     // Skip files that don't have an entryPoint, no exports, or are not .js
     if (!entryPoint || exports?.length < 1 || !fileName.endsWith('.js')) {
       continue;
     }
 
-    const importedPaths: FilesMapping[] = [
-      {
-        path: `${publicPath}${fileName}`,
-        dynamicImport: false,
-      },
-    ];
+    const importedPaths: string[] = [`${publicPath}${fileName}`];
 
     for (const { kind, external, path } of imports) {
-      if (
-        external ||
-        initialFiles.has(path) ||
-        (kind !== 'dynamic-import' && kind !== 'import-statement')
-      ) {
+      if (external || initialFiles.has(path) || kind !== 'import-statement') {
         continue;
       }
 
-      importedPaths.push({
-        path: `${publicPath}${path}`,
-        dynamicImport: kind === 'dynamic-import',
-      });
+      importedPaths.push(`${publicPath}${path}`);
     }
 
     entryPointToBundles[entryPoint] = importedPaths;

packages/angular/ssr/src/manifest.ts

@@ -123,21 +123,16 @@ export interface AngularAppManifest {
    * Maps entry-point names to their corresponding browser bundles and loading strategies.
    *
    * - **Key**: The entry-point name, typically the value of `ɵentryName`.
-   * - **Value**: An array of objects, each representing a browser bundle with:
-   *   - `path`: The filename or URL of the associated JavaScript bundle to preload.
-   *   - `dynamicImport`: A boolean indicating whether the bundle is loaded via a dynamic `import()`.
-   *     If `true`, the bundle is lazily loaded, impacting its preloading behavior.
+   * - **Value**: A readonly array of JavaScript bundle paths or `undefined` if no bundles are associated.
    *
    * ### Example
    * ```ts
    * {
-   *   'src/app/lazy/lazy.ts': [{ path: 'src/app/lazy/lazy.js', dynamicImport: true }]
+   *   'src/app/lazy/lazy.ts': ['src/app/lazy/lazy.js']
    * }
    * ```
    */
-  readonly entryPointToBrowserMapping?: Readonly<
-    Record<string, ReadonlyArray<{ path: string; dynamicImport: boolean }> | undefined>
-  >;
+  readonly entryPointToBrowserMapping?: Readonly<Record<string, readonly string[] | undefined>>;
 }
 
 /**

packages/angular/ssr/src/routes/ng-routes.ts

@@ -148,7 +148,7 @@ async function* handleRoute(options: {
 
     const { redirectTo, loadChildren, loadComponent, children, ɵentryName } = route;
     if (ɵentryName && loadComponent) {
-      appendPreloadToMetadata(ɵentryName, entryPointToBrowserMapping, metadata, true);
+      appendPreloadToMetadata(ɵentryName, entryPointToBrowserMapping, metadata);
     }
 
     if (metadata.renderMode === RenderMode.Prerender) {
@@ -192,11 +192,7 @@ async function* handleRoute(options: {
     // Load and process lazy-loaded child routes
     if (loadChildren) {
       if (ɵentryName) {
-        // When using `loadChildren`, the entire feature area (including multiple routes) is loaded.
-        // As a result, we do not want all dynamic-import dependencies to be preload, because it involves multiple dependencies
-        // across different child routes. In contrast, `loadComponent` only loads a single component, which allows
-        // for precise control over preloading, ensuring that the files preloaded are exactly those required for that specific route.
-        appendPreloadToMetadata(ɵentryName, entryPointToBrowserMapping, metadata, false);
+        appendPreloadToMetadata(ɵentryName, entryPointToBrowserMapping, metadata);
       }
 
       const loadedChildRoutes = await loadChildrenHelper(
@@ -336,7 +332,6 @@ function appendPreloadToMetadata(
   entryName: string,
   entryPointToBrowserMapping: EntryPointToBrowserMapping,
   metadata: ServerConfigRouteTreeNodeMetadata,
-  includeDynamicImports: boolean,
 ): void {
   const existingPreloads = metadata.preload ?? [];
   if (!entryPointToBrowserMapping || existingPreloads.length >= MODULE_PRELOAD_MAX) {
@@ -350,13 +345,8 @@ function appendPreloadToMetadata(
 
   // Merge existing preloads with new ones, ensuring uniqueness and limiting the total to the maximum allowed.
   const combinedPreloads: Set<string> = new Set(existingPreloads);
-  for (const { dynamicImport, path } of preload) {
-    if (dynamicImport && !includeDynamicImports) {
-      continue;
-    }
-
-    combinedPreloads.add(path);
-
+  for (const href of preload) {
+    combinedPreloads.add(href);
     if (combinedPreloads.size === MODULE_PRELOAD_MAX) {
       break;
     }

tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-preload-links.ts

@@ -143,17 +143,15 @@ const RESPONSE_EXPECTS: Record<
     matches: [
       /<link rel="modulepreload" href="(ssg\.routes-[a-zA-Z0-9]{8}\.js)">/,
       /<link rel="modulepreload" href="(ssg-one-[a-zA-Z0-9]{8}\.js)">/,
-      /<link rel="modulepreload" href="(cross-dep-[a-zA-Z0-9]{8}\.js)">/,
     ],
-    notMatches: [/home/, /ssr/, /csr/, /ssg-two/, /ssg\-component/],
+    notMatches: [/home/, /ssr/, /csr/, /ssg-two/, /ssg\-component/, /cross-dep-/],
   },
   '/ssg/two': {
     matches: [
       /<link rel="modulepreload" href="(ssg\.routes-[a-zA-Z0-9]{8}\.js)">/,
       /<link rel="modulepreload" href="(ssg-two-[a-zA-Z0-9]{8}\.js)">/,
-      /<link rel="modulepreload" href="(cross-dep-[a-zA-Z0-9]{8}\.js)">/,
     ],
-    notMatches: [/home/, /ssr/, /csr/, /ssg-one/, /ssg\-component/],
+    notMatches: [/home/, /ssr/, /csr/, /ssg-one/, /ssg\-component/, /cross-dep-/],
   },
   '/ssr': {
     matches: [/<link rel="modulepreload" href="(ssr-[a-zA-Z0-9]{8}\.js)">/],