Reduce stalls when opening large diffs (#4574)

* perf(app): reduce avoidable work when opening large diffs

Large snapshots were recursively reconstructed for reference stability, while native scroll worklets captured complete file models. Preserve identity at the data producers and prepare text for the visible window without rebuilding unchanged files.

* test(app): await commit diff query completion without polling

* chore(app): remove profiling artifacts from the source tree

packages/app/src/git/diff-document/model.ts

@@ -157,21 +157,26 @@ function appendReusableFileRows(candidate: {
     !candidate.input.wrapLines &&
     candidate.model.reviewGeometryKey === candidate.reviewGeometryKey &&
     candidate.file.top === candidate.fileTop &&
+    candidate.file.fileIndex === candidate.fileIndex &&
     candidate.file.rowStart === candidate.rows.length;
-  if (retainsRowGeometry) {
-    candidate.rows.push(...reusedRows);
-    return {
-      bottom: candidate.bodyTop + candidate.file.bodyHeight,
-      maximumHorizontalOverflow: Math.max(
-        0,
-        candidate.file.contentWidth - candidate.input.viewportWidth,
-      ),
-    };
-  }
-
   let top = candidate.bodyTop;
   for (const reusedRow of reusedRows) {
-    const nextRow = repositionReusedRow(reusedRow, candidate, top);
+    let nextRow = retainsRowGeometry ? reusedRow : repositionReusedRow(reusedRow, candidate, top);
+    if (
+      nextRow.kind === "line" &&
+      intersectsMaterializationWindow(candidate.input, top, top + nextRow.height) &&
+      nextRow.cells.some((cell) => cell && cell.fragments.length === 0)
+    ) {
+      nextRow = {
+        ...nextRow,
+        cells: materializeCells(
+          nextRow.cells,
+          candidate.file.file,
+          candidate.file.gutterWidth,
+          candidate.input,
+        ),
+      };
+    }
     candidate.rows.push(nextRow);
     top += nextRow.height;
   }
@@ -232,71 +237,45 @@ function appendNewFileRows(candidate: {
     };
   }
 
-  const deferredLines =
-    candidate.input.materializationWindow && !candidate.input.wrapLines
-      ? geometryLines(lineSources(candidate.file, candidate.input.layout, false), candidate.input)
-      : null;
-  const deferredBodyHeight = deferredLines?.reduce((height, line) => height + line.height, 0) ?? 0;
-  const shouldMaterialize =
-    deferredLines === null ||
-    intersectsMaterializationWindow(
-      candidate.input,
-      candidate.fileTop,
-      candidate.bodyTop + deferredBodyHeight + DIFF_BODY_BORDER_HEIGHT,
-    );
-  return shouldMaterialize
-    ? appendMeasuredFileRows(candidate)
-    : appendGeometryFileRows(candidate, deferredLines);
-}
-
-function appendGeometryFileRows(
-  candidate: Parameters<typeof appendNewFileRows>[0],
-  lines: readonly GeometryLine[],
-): FileRowsResult {
-  let top = candidate.bodyTop;
-  for (const line of lines) {
-    candidate.rows.push({
-      kind: "line",
-      index: candidate.rows.length,
-      fileIndex: candidate.fileIndex,
-      path: candidate.file.path,
-      top,
-      height: line.height,
-      cells: line.cells,
-      reviewHeight: line.reviewHeight,
-    });
-    top += line.height;
-  }
-  return { bottom: top + DIFF_BODY_BORDER_HEIGHT, maximumHorizontalOverflow: 0 };
-}
-
-function appendMeasuredFileRows(
-  candidate: Parameters<typeof appendNewFileRows>[0],
-): FileRowsResult {
+  const lines = geometryLines(
+    lineSources(candidate.file, candidate.input.layout, false),
+    candidate.input,
+  );
+  const fileBottom =
+    candidate.bodyTop +
+    lines.reduce((height, line) => height + line.height, 0) +
+    DIFF_BODY_BORDER_HEIGHT;
+  const measureWidth =
+    !candidate.input.wrapLines &&
+    intersectsMaterializationWindow(candidate.input, candidate.fileTop, fileBottom);
   let top = candidate.bodyTop;
   let maximumHorizontalOverflow = 0;
-  for (const sourceCells of lineSources(candidate.file, candidate.input.layout, true)) {
-    const columnCount = sourceCells.length;
-    const columnWidth = candidate.input.viewportWidth / columnCount;
-    const availableWidth = Math.max(
-      candidate.input.measureText.measure("M"),
-      columnWidth - candidate.gutterWidth - CODE_HORIZONTAL_PADDING,
-    );
-    const cells = sourceCells.map((source) => {
-      if (!source) return null;
-      const cell = measureCell({ source, availableWidth, input: candidate.input });
-      maximumHorizontalOverflow = Math.max(
-        maximumHorizontalOverflow,
-        candidate.gutterWidth + CODE_HORIZONTAL_PADDING + measureCellWidth(cell) - columnWidth,
-      );
-      return cell;
-    }) as DiffLineRow["cells"];
+  for (const line of lines) {
+    const shouldMaterialize =
+      candidate.input.wrapLines ||
+      intersectsMaterializationWindow(candidate.input, top, top + line.height);
+    const cells = shouldMaterialize
+      ? materializeCells(line.cells, candidate.file, candidate.gutterWidth, candidate.input)
+      : line.cells;
+    const columnWidth = candidate.input.viewportWidth / cells.length;
+    if (measureWidth) {
+      for (const cell of cells) {
+        if (!cell) continue;
+        const width =
+          cell.fragments.length > 0
+            ? measureCellWidth(cell)
+            : candidate.input.measureText.measure(displayLineText(cell.content));
+        maximumHorizontalOverflow = Math.max(
+          maximumHorizontalOverflow,
+          candidate.gutterWidth + CODE_HORIZONTAL_PADDING + width - columnWidth,
+        );
+      }
+    }
     const textHeight = Math.max(
       candidate.input.typography.lineHeight,
       ...cells.map((cell) => (cell?.fragments.length ?? 1) * candidate.input.typography.lineHeight),
     );
-    const reviewHeight = reviewHeightForCells(cells, candidate.input);
-    const height = textHeight + reviewHeight;
+    const height = textHeight + line.reviewHeight;
     candidate.rows.push({
       kind: "line",
       index: candidate.rows.length,
@@ -305,13 +284,46 @@ function appendMeasuredFileRows(
       top,
       height,
       cells,
-      reviewHeight,
+      reviewHeight: line.reviewHeight,
     });
     top += height;
   }
   return { bottom: top + DIFF_BODY_BORDER_HEIGHT, maximumHorizontalOverflow };
 }
 
+function materializeCells(
+  cells: DiffLineRow["cells"],
+  file: BuildDiffDocumentModelInput["files"][number],
+  gutterWidth: number,
+  input: BuildDiffDocumentModelInput,
+): DiffLineRow["cells"] {
+  const availableWidth = Math.max(
+    input.measureText.measure("M"),
+    input.viewportWidth / cells.length - gutterWidth - CODE_HORIZONTAL_PADDING,
+  );
+  return cells.map((cell) => {
+    if (!cell || cell.fragments.length > 0) return cell;
+    const sourceLine =
+      file.hunks[cell.sourceIdentity.hunkIndex]!.lines[cell.sourceIdentity.lineIndex]!;
+    return measureCell({
+      source: {
+        ...cell,
+        tokenText: cell.type === "header" ? [] : compactHighlightTokens(sourceLine.tokens ?? []),
+      },
+      availableWidth,
+      input,
+    });
+  }) as DiffLineRow["cells"];
+}
+
+function displayLineText(text: string): string {
+  return text.includes("\t")
+    ? segmentGraphemes(text)
+        .map((segment) => segment.text)
+        .join("")
+    : text;
+}
+
 export function reviewGeometryKey(
   reviewActions: BuildDiffDocumentModelInput["reviewActions"],
 ): string {
@@ -334,7 +346,11 @@ export function retainReusableModels(
   previous: readonly DiffDocumentModel[] | undefined,
   next: DiffDocumentModel,
 ): DiffDocumentModel[] {
-  const fullest = [...(previous ?? []), next].reduce((best, candidate) =>
+  const sources = new Set(next.files.map((file) => file.file));
+  const compatible = previous?.filter((model) =>
+    model.files.every((file) => sources.has(file.file)),
+  );
+  const fullest = [...(compatible ?? []), next].reduce((best, candidate) =>
     measuredFileCount(candidate) > measuredFileCount(best) ? candidate : best,
   );
   return fullest === next ? [next] : [fullest, next];
@@ -437,16 +453,17 @@ function intersectsMaterializationWindow(
 
 function hasMeasuredFileRows(model: DiffDocumentModel, file: DiffFileSection): boolean {
   if (file.isCollapsed) return false;
-  return model.rows.slice(file.rowStart, file.rowEnd).every((row) => {
+  return model.rows.slice(file.rowStart, file.rowEnd).some((row) => {
     if (row.kind !== "line") return true;
-    return row.cells.every((cell) => !cell || cell.fragments.length > 0);
+    return row.cells.some((cell) => cell && cell.fragments.length > 0);
   });
 }
 
 function indexReusableModels(
   models: readonly DiffDocumentModel[] | undefined,
 ): ReusableModelIndex[] {
-  return (models ?? []).map((model) => {
+  // The latest model includes text prepared by later scroll windows.
+  return (models ?? []).toReversed().map((model) => {
     const filesBySource = new Map<BuildDiffDocumentModelInput["files"][number], DiffFileSection>();
     const measuredFiles = new Set<DiffFileSection>();
     for (const file of model.files) {