fix(pack): scope dev stats to entrypoints

Author: fireairforce

crates/pack-api/src/entrypoint.rs

@@ -14,7 +14,7 @@ use crate::{
     operation::EntrypointsOperation,
     project::ProjectContainer,
     utils::get_issues,
-    webpack_stats::generate_webpack_stats,
+    webpack_stats::{OutputAssetGroups, generate_webpack_stats},
 };
 
 #[turbo_tasks::value(shared)]
@@ -59,15 +59,19 @@ pub async fn all_output_assets_operation(
 ) -> Result<Vc<OutputAssets>> {
     let project = container.project();
 
-    let endpoint_assets = project
+    let endpoint_asset_groups = project
         .get_all_endpoints()
         .await?
         .iter()
-        .map(|endpoint| async move { endpoint.output().await?.output_assets.await })
+        .map(|endpoint| async move { Ok(endpoint.output().await?.output_assets) })
         .try_join()
         .await?;
 
-    let output_assets: FxIndexSet<ResolvedVc<Box<dyn OutputAsset>>> = endpoint_assets
+    let output_assets: FxIndexSet<ResolvedVc<Box<dyn OutputAsset>>> = endpoint_asset_groups
+        .iter()
+        .map(|assets| async move { assets.await })
+        .try_join()
+        .await?
         .iter()
         .flat_map(|assets| assets.iter().copied())
         .collect();
@@ -89,22 +93,56 @@ pub async fn all_output_assets_operation(
     let mut stats_outputs: Vec<ResolvedVc<Box<dyn OutputAsset>>> = Vec::new();
 
     if !has_server {
-        stats_outputs.push(make_stats_output(output_assets, dist_root).await?);
+        stats_outputs.push(
+            make_stats_output(
+                output_assets,
+                Vc::<OutputAssetGroups>::cell(endpoint_asset_groups),
+                dist_root,
+            )
+            .await?,
+        );
     } else {
         let server_dist_root_vc = container.project().server_dist_root();
         let server_dist_root_read = server_dist_root_vc.await?;
         let mut client: Vec<ResolvedVc<Box<dyn OutputAsset>>> = Vec::new();
         let mut server: Vec<ResolvedVc<Box<dyn OutputAsset>>> = Vec::new();
+        let mut client_groups = Vec::with_capacity(endpoint_asset_groups.len());
+        for assets in endpoint_asset_groups {
+            let mut group = Vec::new();
+            for asset in assets.await?.iter().copied() {
+                if !asset.path().await?.is_inside_ref(&server_dist_root_read) {
+                    group.push(asset);
+                }
+            }
+            if !group.is_empty() {
+                client_groups.push(ResolvedVc::cell(group));
+            }
+        }
         for asset in output_assets.await?.iter().copied() {
             if asset.path().await?.is_inside_ref(&server_dist_root_read) {
                 server.push(asset);
             } else {
                 client.push(asset);
             }
         }
-        stats_outputs.push(make_stats_output(Vc::cell(client), dist_root).await?);
+        stats_outputs.push(
+            make_stats_output(
+                Vc::cell(client),
+                Vc::<OutputAssetGroups>::cell(client_groups),
+                dist_root,
+            )
+            .await?,
+        );
         if !server.is_empty() {
-            stats_outputs.push(make_stats_output(Vc::cell(server), server_dist_root_vc).await?);
+            let server_assets = ResolvedVc::cell(server);
+            stats_outputs.push(
+                make_stats_output(
+                    *server_assets,
+                    Vc::<OutputAssetGroups>::cell(vec![server_assets]),
+                    server_dist_root_vc,
+                )
+                .await?,
+            );
         }
     }
 
@@ -113,9 +151,10 @@ pub async fn all_output_assets_operation(
 
 async fn make_stats_output(
     assets: Vc<OutputAssets>,
+    asset_groups: Vc<OutputAssetGroups>,
     dist_root: Vc<FileSystemPath>,
 ) -> Result<ResolvedVc<Box<dyn OutputAsset>>> {
-    let webpack_stats = generate_webpack_stats(assets, dist_root).await?;
+    let webpack_stats = generate_webpack_stats(assets, asset_groups, dist_root).await?;
     let stats_json = serde_json::to_string_pretty(&*webpack_stats)?;
     let dist_root_owned = dist_root.owned().await?;
     let stats_output = VirtualOutputAsset::new(

crates/pack-api/src/webpack_stats.rs

@@ -31,6 +31,9 @@ pub struct AssetIntermediateInfo {
     pub dev_chunk_list: Option<RcStr>,
 }
 
+#[turbo_tasks::value(transparent)]
+pub struct OutputAssetGroups(pub Vec<ResolvedVc<OutputAssets>>);
+
 fn normalize_stats_path(path: RcStr) -> RcStr {
     path.strip_prefix("./").map(Into::into).unwrap_or(path)
 }
@@ -381,6 +384,7 @@ pub async fn get_asset_intermediate_info(
 #[turbo_tasks::function]
 pub async fn generate_webpack_stats(
     entry_assets: Vc<OutputAssets>,
+    entry_asset_groups: Vc<OutputAssetGroups>,
     dist_root: Vc<FileSystemPath>,
 ) -> Result<Vc<WebpackStats>> {
     let mut assets = vec![];
@@ -402,10 +406,13 @@ pub async fn generate_webpack_stats(
         })
         .try_join()
         .await?;
+    let asset_info_by_asset: FxHashMap<_, _> = all_assets
+        .iter()
+        .copied()
+        .zip(asset_results.iter())
+        .collect();
 
-    let mut dev_chunk_lists: Vec<RcStr> = vec![];
-    for info in asset_results {
-        let info = info;
+    for info in &asset_results {
         if seen_asset_paths.insert(info.asset.name.clone()) {
             assets.push(info.asset.clone());
         }
@@ -424,17 +431,39 @@ pub async fn generate_webpack_stats(
                 modules.insert(module.id.clone(), module.clone());
             }
         }
-        if let Some(dev_chunk_list) = &info.dev_chunk_list {
-            dev_chunk_lists.push(dev_chunk_list.clone());
-        }
     }
 
-    for dev_chunk_list in dev_chunk_lists {
-        for entrypoint in entrypoints.values_mut() {
-            entrypoint.chunks.push(dev_chunk_list.clone());
-            entrypoint.assets.push(WebpackStatsEntrypointAssets {
-                name: dev_chunk_list.clone(),
-            });
+    // Endpoint output groups preserve which evaluate entry owns each development chunk list.
+    // Associating these lists after flattening all output assets made every entrypoint include
+    // every other page's HMR bootstrap in multi-page builds.
+    for group in entry_asset_groups.await?.iter().copied() {
+        let group = group.await?;
+        let group_entrypoints: FxIndexMap<_, _> = group
+            .iter()
+            .filter_map(|asset| asset_info_by_asset.get(asset))
+            .flat_map(|info| info.entrypoints.iter())
+            .map(|(name, _)| (name.clone(), ()))
+            .collect();
+        let group_chunk_lists: FxIndexMap<_, _> = group
+            .iter()
+            .filter_map(|asset| asset_info_by_asset.get(asset))
+            .filter_map(|info| info.dev_chunk_list.as_ref())
+            .map(|name| (name.clone(), ()))
+            .collect();
+
+        for entrypoint_name in group_entrypoints.keys() {
+            let Some(entrypoint) = entrypoints.get_mut(entrypoint_name) else {
+                continue;
+            };
+            for dev_chunk_list in group_chunk_lists.keys() {
+                if entrypoint.chunks.contains(dev_chunk_list) {
+                    continue;
+                }
+                entrypoint.chunks.push(dev_chunk_list.clone());
+                entrypoint.assets.push(WebpackStatsEntrypointAssets {
+                    name: dev_chunk_list.clone(),
+                });
+            }
         }
     }
 

packages/pack/src/__test__/serveMultiClientStatsChild.ts

@@ -0,0 +1,110 @@
+import fs from "fs";
+import path from "path";
+import { serve } from "../commands/dev";
+
+const [, , projectPath, portArg] = process.argv;
+
+if (!projectPath || !portArg) {
+  throw new Error("Usage: serveMultiClientStatsChild <projectPath> <port>");
+}
+
+const port = Number(portArg);
+const srcDir = path.join(projectPath, "src");
+const statsPath = path.join(projectPath, "dist", "stats.json");
+
+function entrypointAssets(stats: any, name: string): string[] {
+  return (stats.entrypoints?.[name]?.assets ?? []).map((asset: any) =>
+    typeof asset === "string" ? asset : (asset?.name ?? ""),
+  );
+}
+
+function chunkLists(assets: string[]): string[] {
+  return assets.filter(
+    (asset) => asset.includes("src_alpha_") || asset.includes("src_beta_"),
+  );
+}
+
+async function waitForStats() {
+  const deadline = Date.now() + 20_000;
+
+  while (true) {
+    if (fs.existsSync(statsPath)) {
+      const stats = JSON.parse(fs.readFileSync(statsPath, "utf8"));
+      if (stats.entrypoints?.alpha && stats.entrypoints?.beta) {
+        return stats;
+      }
+    }
+    if (Date.now() > deadline) {
+      throw new Error(`Timed out waiting for ${statsPath}`);
+    }
+    await new Promise((resolve) => setTimeout(resolve, 100));
+  }
+}
+
+async function main() {
+  fs.rmSync(projectPath, { recursive: true, force: true });
+  fs.mkdirSync(srcDir, { recursive: true });
+  fs.writeFileSync(
+    path.join(srcDir, "alpha.js"),
+    'import("./alpha-lazy.js").then(({ default: value }) => console.log(value));\n',
+  );
+  fs.writeFileSync(
+    path.join(srcDir, "alpha-lazy.js"),
+    'export default "alpha";\n',
+  );
+  fs.writeFileSync(
+    path.join(srcDir, "beta.js"),
+    'import("./beta-lazy.js").then(({ default: value }) => console.log(value));\n',
+  );
+  fs.writeFileSync(
+    path.join(srcDir, "beta-lazy.js"),
+    'export default "beta";\n',
+  );
+
+  await serve(
+    {
+      config: {
+        entry: [
+          { import: "./src/alpha.js", name: "alpha" },
+          { import: "./src/beta.js", name: "beta" },
+        ],
+        output: { path: "./dist", clean: true },
+        stats: true,
+      },
+    },
+    projectPath,
+    projectPath,
+    {
+      hostname: "127.0.0.1",
+      logServerInfo: false,
+      port,
+    },
+  );
+
+  const stats = await waitForStats();
+  const alphaChunkLists = chunkLists(entrypointAssets(stats, "alpha"));
+  const betaChunkLists = chunkLists(entrypointAssets(stats, "beta"));
+
+  console.log(
+    `__STATS_SNAPSHOT__${JSON.stringify({
+      alphaHasOwnChunkLists: alphaChunkLists.some((asset) =>
+        asset.includes("src_alpha_"),
+      ),
+      alphaHasOnlyOwnChunkLists: alphaChunkLists.every((asset) =>
+        asset.includes("src_alpha_"),
+      ),
+      betaHasOwnChunkLists: betaChunkLists.some((asset) =>
+        asset.includes("src_beta_"),
+      ),
+      betaHasOnlyOwnChunkLists: betaChunkLists.every((asset) =>
+        asset.includes("src_beta_"),
+      ),
+    })}`,
+  );
+  process.kill(process.pid, "SIGTERM");
+}
+
+main().catch((error) => {
+  console.error(error);
+  process.exit(1);
+});

packages/pack/src/__test__/serveStats.test.ts

@@ -135,6 +135,17 @@ describe("serve stats", () => {
     `);
   }, 30_000);
 
+  it("keeps dev chunk lists scoped to their owning entrypoint", async () => {
+    await expect(
+      runServeStatsFixture("serveMultiClientStatsChild.ts"),
+    ).resolves.toEqual({
+      alphaHasOwnChunkLists: true,
+      alphaHasOnlyOwnChunkLists: true,
+      betaHasOwnChunkLists: true,
+      betaHasOnlyOwnChunkLists: true,
+    });
+  }, 30_000);
+
   it("keeps all named server entries after rebuilding one entry", async () => {
     await expect(
       runServeStatsFixture("serveMultiServerStatsChild.ts"),