@brimveyn/aimux 1.6.0 → 1.6.2

package/src/state/reducers/git-mode-state.ts

@@ -7,6 +7,7 @@ import {
   moveGitSelection,
   reconcileSelectedGitEntryKey,
 } from '../git-tree'
+import { clearDiffCacheForPath, clearDiffCacheForPaths } from './diff-cache'
 import { sortFilesBySection } from './git-panel-state'
 
 function applyFold(state: AppState, key: string, foldId: string, next: FoldState): AppState {
@@ -28,33 +29,6 @@ function applyFold(state: AppState, key: string, foldId: string, next: FoldState
   return { ...state, gitMode: { ...state.gitMode, folds: nextFolds } }
 }
 
-function clearDiffCacheForPath(state: AppState, path: string): AppState {
-  const nextDiffs = { ...state.gitMode.diffs }
-  const nextFolds = { ...state.gitMode.folds }
-  const nextLoading = { ...state.gitMode.loading }
-  let changed = false
-  for (const key of Object.keys(nextDiffs)) {
-    if (nextDiffs[key]?.path !== path) continue
-    delete nextDiffs[key]
-    changed = true
-  }
-  for (const key of Object.keys(nextFolds)) {
-    if (!key.endsWith(`:${path}`)) continue
-    delete nextFolds[key]
-    changed = true
-  }
-  for (const key of Object.keys(nextLoading)) {
-    if (!key.endsWith(`:${path}`)) continue
-    delete nextLoading[key]
-    changed = true
-  }
-  if (!changed) return state
-  return {
-    ...state,
-    gitMode: { ...state.gitMode, diffs: nextDiffs, folds: nextFolds, loading: nextLoading },
-  }
-}
-
 export function emptyGitMode(): GitModeState {
   return {
     actionMessage: null,
@@ -62,7 +36,10 @@ export function emptyGitMode(): GitModeState {
     diffs: {},
     diffView: 'split',
     folds: {},
+    headOffset: 0,
+    highlights: {},
     loading: {},
+    parsedFiles: {},
     pendingDeletePath: null,
     selectedEntryKey: null,
   }
@@ -83,14 +60,29 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
             state.gitPanel.files,
             state.gitMode.collapsedFolders,
             state.gitPane.fileListMode,
-            null
+            null,
+            [],
+            state.gitPane.treeCompaction
           ),
         },
       }
     }
     case 'exit-git-mode': {
       if (state.focusMode !== 'git') return state
-      return { ...state, focusMode: 'navigation' }
+      return {
+        ...state,
+        focusMode: 'navigation',
+        gitMode: {
+          ...state.gitMode,
+          actionMessage: null,
+          diffs: {},
+          folds: {},
+          headOffset: 0,
+          highlights: {},
+          loading: {},
+          parsedFiles: {},
+        },
+      }
     }
     case 'git-mode-move-selection': {
       const next = moveGitSelection(
@@ -98,7 +90,8 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
         state.gitMode.collapsedFolders,
         state.gitPane.fileListMode,
         state.gitMode.selectedEntryKey,
-        action.delta
+        action.delta,
+        state.gitPane.treeCompaction
       )
       if (!next || next === state.gitMode.selectedEntryKey) return state
       return {
@@ -116,7 +109,8 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
         state.gitMode.collapsedFolders,
         state.gitPane.fileListMode,
         state.gitMode.selectedEntryKey,
-        action.delta
+        action.delta,
+        state.gitPane.treeCompaction
       )
       if (!next || next === state.gitMode.selectedEntryKey) return state
       return {
@@ -134,7 +128,8 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
         state.gitMode.collapsedFolders,
         state.gitPane.fileListMode,
         state.gitMode.selectedEntryKey,
-        [action.key]
+        [action.key],
+        state.gitPane.treeCompaction
       )
       if (!next || next !== action.key || next === state.gitMode.selectedEntryKey) return state
       return {
@@ -149,6 +144,7 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
     case 'git-mode-toggle-folder': {
       const row = getSelectedGitRow(state.gitPanel.files, {
         collapsedFolders: state.gitMode.collapsedFolders,
+        compact: state.gitPane.treeCompaction,
         fileListMode: state.gitPane.fileListMode,
         selectedEntryKey: action.key,
       })
@@ -164,6 +160,7 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
     case 'git-mode-toggle-selected-folder': {
       const row = getSelectedGitRow(state.gitPanel.files, {
         collapsedFolders: state.gitMode.collapsedFolders,
+        compact: state.gitPane.treeCompaction,
         fileListMode: state.gitPane.fileListMode,
         selectedEntryKey: state.gitMode.selectedEntryKey,
       })
@@ -179,6 +176,7 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
     case 'git-mode-collapse-selection': {
       const row = getSelectedGitRow(state.gitPanel.files, {
         collapsedFolders: state.gitMode.collapsedFolders,
+        compact: state.gitPane.treeCompaction,
         fileListMode: state.gitPane.fileListMode,
         selectedEntryKey: state.gitMode.selectedEntryKey,
       })
@@ -205,6 +203,7 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
     case 'git-mode-expand-selection': {
       const row = getSelectedGitRow(state.gitPanel.files, {
         collapsedFolders: state.gitMode.collapsedFolders,
+        compact: state.gitPane.treeCompaction,
         fileListMode: state.gitPane.fileListMode,
         selectedEntryKey: state.gitMode.selectedEntryKey,
       })
@@ -224,24 +223,90 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
             state.gitPanel.files,
             state.gitMode.collapsedFolders,
             fileListMode,
-            state.gitMode.selectedEntryKey
+            state.gitMode.selectedEntryKey,
+            [],
+            state.gitPane.treeCompaction
           ),
         },
         gitPane: { ...state.gitPane, fileListMode },
       }
     }
+    case 'git-mode-toggle-tree-compaction': {
+      const treeCompaction = !state.gitPane.treeCompaction
+      return {
+        ...state,
+        gitMode: {
+          ...state.gitMode,
+          pendingDeletePath: null,
+          selectedEntryKey: reconcileSelectedGitEntryKey(
+            state.gitPanel.files,
+            state.gitMode.collapsedFolders,
+            state.gitPane.fileListMode,
+            state.gitMode.selectedEntryKey,
+            [],
+            treeCompaction
+          ),
+        },
+        gitPane: { ...state.gitPane, treeCompaction },
+      }
+    }
     case 'git-mode-set-diff': {
       const nextLoading = { ...state.gitMode.loading }
       delete nextLoading[action.key]
+      // Drop stale derived entries (parsed + highlights) whose hash no longer matches.
+      const nextParsed = { ...state.gitMode.parsedFiles }
+      const prevParsed = nextParsed[action.key]
+      if (prevParsed && prevParsed.hash !== action.hash) delete nextParsed[action.key]
+      const nextHighlights = { ...state.gitMode.highlights }
+      for (const key of Object.keys(nextHighlights)) {
+        if (!key.startsWith(`${action.key}|`)) continue
+        if (nextHighlights[key]?.hash !== action.hash) delete nextHighlights[key]
+      }
       return {
         ...state,
         gitMode: {
           ...state.gitMode,
           diffs: { ...state.gitMode.diffs, [action.key]: action.diff },
+          highlights: nextHighlights,
           loading: nextLoading,
+          parsedFiles: nextParsed,
+        },
+      }
+    }
+    case 'git-mode-set-parsed': {
+      return {
+        ...state,
+        gitMode: {
+          ...state.gitMode,
+          parsedFiles: {
+            ...state.gitMode.parsedFiles,
+            [action.key]: { file: action.file, hash: action.hash },
+          },
+        },
+      }
+    }
+    case 'git-mode-set-highlights': {
+      const k = `${action.key}|${action.themeId}`
+      return {
+        ...state,
+        gitMode: {
+          ...state.gitMode,
+          highlights: {
+            ...state.gitMode.highlights,
+            [k]: {
+              add: action.add,
+              del: action.del,
+              hash: action.hash,
+              themeId: action.themeId,
+            },
+          },
         },
       }
     }
+    case 'git-mode-invalidate-diffs': {
+      if (action.paths.length === 0) return state
+      return clearDiffCacheForPaths(state, new Set(action.paths))
+    }
     case 'git-mode-set-loading': {
       const nextLoading = { ...state.gitMode.loading }
       if (action.loading) {
@@ -266,6 +331,41 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
       const next = state.gitMode.diffView === 'split' ? 'stacked' : 'split'
       return { ...state, gitMode: { ...state.gitMode, diffView: next } }
     }
+    case 'git-mode-shift-head-offset': {
+      const next = Math.max(0, state.gitMode.headOffset + action.delta)
+      if (next === state.gitMode.headOffset) return state
+      return {
+        ...state,
+        gitMode: {
+          ...state.gitMode,
+          actionMessage: null,
+          diffs: {},
+          folds: {},
+          headOffset: next,
+          highlights: {},
+          loading: {},
+          parsedFiles: {},
+          pendingDeletePath: null,
+        },
+      }
+    }
+    case 'git-mode-set-head-offset': {
+      const next = Math.max(0, action.offset)
+      if (next === state.gitMode.headOffset) return state
+      return {
+        ...state,
+        gitMode: {
+          ...state.gitMode,
+          diffs: {},
+          folds: {},
+          headOffset: next,
+          highlights: {},
+          loading: {},
+          parsedFiles: {},
+          pendingDeletePath: null,
+        },
+      }
+    }
     case 'git-mode-fold-adjust': {
       const perPath = state.gitMode.folds[action.key] ?? {}
       const prev = perPath[action.foldId] ?? { bottom: 0, top: 0 }
@@ -314,7 +414,8 @@ export function reduceGitModeState(state: AppState, action: AppAction): AppState
         state.gitMode.collapsedFolders,
         state.gitPane.fileListMode,
         currentKey,
-        preferredSelection
+        preferredSelection,
+        state.gitPane.treeCompaction
       )
 
       return {

package/src/state/reducers/git-panel-state.ts

@@ -1,11 +1,17 @@
 import type { AppAction, AppState, GitFileEntry, GitFileSection, GitPanelState } from '../types'
 
 import { reconcileSelectedGitEntryKey } from '../git-tree'
+import { clearDiffCacheForPaths } from './diff-cache'
 
 export const GIT_PANEL_MIN_RATIO = 0.2
 export const GIT_PANEL_MAX_RATIO = 0.8
 
-const SECTION_RANK: Record<GitFileSection, number> = { staged: 0, unstaged: 1, untracked: 2 }
+const SECTION_RANK: Record<GitFileSection, number> = {
+  historical: 0,
+  staged: 1,
+  unstaged: 2,
+  untracked: 3,
+}
 
 export function sortFilesBySection(files: GitFileEntry[]): GitFileEntry[] {
   return [...files].sort((a, b) => {
@@ -30,6 +36,32 @@ export function emptyGitPanel(): GitPanelState {
   }
 }
 
+function fileSignature(f: GitFileEntry): string {
+  return `${f.status}|${f.added ?? '-'}|${f.removed ?? '-'}|${f.renamedFrom ?? ''}`
+}
+
+// Paths whose content/status shifted between two snapshots — used to drop
+// stale cached diffs so we re-fetch instead of serving pre-edit data.
+function diffChangedPaths(prev: GitFileEntry[], next: GitFileEntry[]): Set<string> {
+  const prevByKey = new Map<string, string>()
+  for (const f of prev) prevByKey.set(`${f.section}:${f.path}`, fileSignature(f))
+  const changed = new Set<string>()
+  const nextKeys = new Set<string>()
+  for (const f of next) {
+    const key = `${f.section}:${f.path}`
+    nextKeys.add(key)
+    const prevSig = prevByKey.get(key)
+    if (prevSig !== fileSignature(f)) changed.add(f.path)
+  }
+  for (const [key, _sig] of prevByKey) {
+    if (nextKeys.has(key)) continue
+    const [, ...rest] = key.split(':')
+    const path = rest.join(':')
+    if (path) changed.add(path)
+  }
+  return changed
+}
+
 function sameFiles(a: GitFileEntry[], b: GitFileEntry[]): boolean {
   if (a.length !== b.length) return false
   for (let i = 0; i < a.length; i++) {
@@ -104,7 +136,9 @@ export function reduceGitPanelState(state: AppState, action: AppAction): AppStat
         sortedNext,
         state.gitMode.collapsedFolders,
         state.gitPane.fileListMode,
-        state.gitMode.selectedEntryKey
+        state.gitMode.selectedEntryKey,
+        [],
+        state.gitPane.treeCompaction
       )
       if (
         prev.branch === next.branch &&
@@ -116,7 +150,8 @@ export function reduceGitPanelState(state: AppState, action: AppAction): AppStat
       ) {
         return state
       }
-      return {
+      const changedPaths = diffChangedPaths(prev.files, sortedNext)
+      const base: AppState = {
         ...state,
         gitMode: { ...state.gitMode, selectedEntryKey: nextSelectedEntryKey },
         gitPanel: {
@@ -128,6 +163,7 @@ export function reduceGitPanelState(state: AppState, action: AppAction): AppStat
           files: sortedNext,
         },
       }
+      return changedPaths.size === 0 ? base : clearDiffCacheForPaths(base, changedPaths)
     }
     case 'git-refresh-error': {
       const prev = state.gitPanel

package/src/state/store.ts

@@ -38,7 +38,9 @@ const DEFAULT_GIT_PANE: GitPaneState = {
   mode: 'embedded',
   path: { enabled: true },
   position: 'bottom',
+  prefetchRadius: 5,
   ratio: 0.5,
+  treeCompaction: true,
   visible: true,
 }
 

package/src/state/types.ts

@@ -1,4 +1,7 @@
 import type { ModeId } from '@brimveyn/aimux-config'
+import type { ThemedToken } from 'shiki'
+
+import type { FileDiffMetadata } from '../diff-parser'
 
 export type BuiltinAssistantId = 'claude' | 'codex' | 'opencode' | 'terminal'
 
@@ -148,13 +151,16 @@ export interface GitPaneState {
   ratio: number
   diffModeRatio: number
   fileListMode: GitFileListMode
+  treeCompaction: boolean
   path: GitPanePathConfig
   diffCount: GitPaneDiffCountConfig
+  /** Prefetch this many neighbours around the selection. 0 disables prefetch. */
+  prefetchRadius: number
 }
 
 export type GitFileStatus = 'M' | 'A' | 'D' | 'R' | 'C' | 'U' | '?'
 
-export type GitFileSection = 'staged' | 'unstaged' | 'untracked'
+export type GitFileSection = 'staged' | 'unstaged' | 'untracked' | 'historical'
 
 export interface GitFileEntry {
   path: string
@@ -195,15 +201,52 @@ export interface FoldState {
   bottom: number
 }
 
+export interface ParsedDiffEntry {
+  hash: string
+  // Stored as unknown at the state boundary; concrete type is FileDiffMetadata
+  // | null, narrowed at read sites via getParsedFile().
+  file: unknown
+}
+
+export interface HighlightsEntry {
+  hash: string
+  themeId: string
+  // See ParsedDiffEntry note — narrowed via getHighlights().
+  add: unknown
+  del: unknown
+}
+
+export function getParsedFile(entry: ParsedDiffEntry | undefined): FileDiffMetadata | null {
+  if (!entry) return null
+  return entry.file as FileDiffMetadata | null
+}
+
+export function getHighlightsTokens(entry: HighlightsEntry | undefined): {
+  add: ThemedToken[][]
+  del: ThemedToken[][]
+} | null {
+  if (!entry) return null
+  return {
+    add: entry.add as ThemedToken[][],
+    del: entry.del as ThemedToken[][],
+  }
+}
+
 export interface GitModeState {
   selectedEntryKey: string | null
   collapsedFolders: Record<string, true>
   diffs: Record<string, DiffData>
+  /** Parsed diff keyed by fileKey. Invalidated on file change or head offset shift. */
+  parsedFiles: Record<string, ParsedDiffEntry>
+  /** Tokenised highlights keyed by `${fileKey}|${themeId}`. */
+  highlights: Record<string, HighlightsEntry>
   loading: Record<string, boolean>
   pendingDeletePath: string | null
   actionMessage: string | null
   diffView: GitDiffView
   folds: Record<string, Record<string, FoldState>>
+  /** Working-tree-vs-HEAD~N offset. 0 = working tree vs HEAD (default). */
+  headOffset: number
 }
 
 interface ModalBase {
@@ -471,12 +514,30 @@ export type GitModeAction =
   | { type: 'git-mode-collapse-selection' }
   | { type: 'git-mode-expand-selection' }
   | { type: 'git-mode-toggle-file-list-mode' }
-  | { type: 'git-mode-set-diff'; key: string; diff: DiffData }
+  | { type: 'git-mode-toggle-tree-compaction' }
+  | { type: 'git-mode-set-diff'; key: string; diff: DiffData; hash: string }
+  | {
+      type: 'git-mode-set-parsed'
+      key: string
+      hash: string
+      file: unknown
+    }
+  | {
+      type: 'git-mode-set-highlights'
+      key: string
+      hash: string
+      themeId: string
+      add: unknown
+      del: unknown
+    }
+  | { type: 'git-mode-invalidate-diffs'; paths: string[] }
   | { type: 'git-mode-set-loading'; key: string; loading: boolean }
   | { type: 'git-mode-set-pending-delete'; path: string | null }
   | { type: 'git-mode-clear-diff-cache'; path: string }
   | { type: 'git-mode-set-message'; message: string | null }
   | { type: 'git-mode-toggle-diff-view' }
+  | { type: 'git-mode-shift-head-offset'; delta: number }
+  | { type: 'git-mode-set-head-offset'; offset: number }
   | {
       type: 'git-mode-fold-adjust'
       key: string

package/src/ui/components/create-session-modal.tsx

@@ -1,7 +1,7 @@
 import type { DirectoryResult } from '../../state/types'
 
 import { abbreviatePath } from '../path-format'
-import { theme } from '../theme'
+import { getCurrentTheme, useTheme } from '../theme'
 import { uiTokens } from '../ui-tokens'
 import { InputField } from './input-field'
 import { ListItem } from './list-item'
@@ -21,14 +21,14 @@ function getDirectoryResultIcon(result: DirectoryResult): string {
 
 function getDirectoryResultColor(result: DirectoryResult): string {
   if (result.type === 'worktree') {
-    return theme.colors['editorWarning.foreground']
+    return getCurrentTheme().colors['editorWarning.foreground']
   }
 
   if (result.type === 'workspace') {
-    return theme.colors['terminal.ansiMagenta']
+    return getCurrentTheme().colors['terminal.ansiMagenta']
   }
 
-  return theme.colors['textLink.foreground']
+  return getCurrentTheme().colors['textLink.foreground']
 }
 
 interface CreateSessionModalProps {
@@ -48,6 +48,7 @@ export function CreateSessionModal({
   selectedIndex,
   sessionName,
 }: CreateSessionModalProps) {
+  const theme = useTheme()
   const dirActive = activeField === 'directory'
   const nameActive = activeField === 'name'
 

package/src/ui/components/diff-renderer/fold-strip.tsx

@@ -1,4 +1,4 @@
-import { theme } from '../../theme'
+import { useTheme } from '../../theme'
 import { FOLD_STEP, type FoldInfo } from './build-rows'
 import { type FoldDispatch } from './pierre-diff'
 
@@ -8,6 +8,7 @@ interface Props {
 }
 
 function Button({ label, onPress }: { label: string; onPress: () => void }) {
+  const theme = useTheme()
   return (
     <box
       paddingLeft={1}
@@ -25,6 +26,7 @@ function Spacer() {
 }
 
 export function FoldStrip({ dispatch, fold }: Props) {
+  const theme = useTheme()
   const { bottomExpanded, foldId, hidden, topExpanded, total } = fold
   const stepUp = Math.min(FOLD_STEP, hidden)
   const stepDown = Math.min(FOLD_STEP, hidden)

package/src/ui/components/diff-renderer/pierre-diff.tsx

@@ -1,20 +1,18 @@
 import type { ScrollBoxRenderable } from '@opentui/core'
 import type { ThemedToken } from 'shiki'
 
-import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'
+import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react'
 
-import type { FoldState } from '../../../state/types'
 import type { ThemeId } from '../../themes'
 
-import { parsePatchFiles } from '../../../diff-parser'
 import { useAppStore } from '../../../state/app-store'
 import { dispatchGlobal } from '../../../state/dispatch-ref'
-import { theme } from '../../theme'
+import { type FoldState } from '../../../state/types'
+import { useTheme } from '../../theme'
 import { buildSplitRows, buildUnifiedRows, firstChangeRowOffset, gutterWidth } from './build-rows'
-import { filetypeFromPath } from './filetype'
-import { tokenizeSide } from './highlight'
 import { SplitView, type SplitViewHandle } from './split-view'
 import { StackedView, type StackedViewHandle } from './stacked-view'
+import { useDiffPreparation } from './use-diff-preparation'
 
 export type DiffView = 'split' | 'stacked'
 
@@ -41,19 +39,16 @@ interface Props {
   view: DiffView
 }
 
-const EMPTY_HIGHLIGHTS: DiffHighlights = { add: [], del: [] }
 const EMPTY_FOLDS: Record<string, FoldState> = {}
 
 export const PierreDiff = forwardRef<PierreDiffHandle, Props>(function PierreDiff(
   { cacheKey, diff, path, themeId, view },
   ref
 ) {
-  const file = useMemo(() => {
-    const patches = parsePatchFiles(diff)
-    return patches[0]?.files[0]
-  }, [diff])
-
-  const filetype = useMemo(() => filetypeFromPath(path), [path])
+  const theme = useTheme()
+  const preparation = useDiffPreparation(cacheKey, diff, path, themeId)
+  const file = preparation.file ?? undefined
+  const highlights: DiffHighlights = preparation.highlights
 
   const terminalCols = useAppStore((s) => s.layout.terminalCols)
   const sidebarWidth = useAppStore((s) => s.sidebar.width)
@@ -77,24 +72,6 @@ export const PierreDiff = forwardRef<PierreDiffHandle, Props>(function PierreDif
     [cacheKey]
   )
 
-  const [highlights, setHighlights] = useState<DiffHighlights>(EMPTY_HIGHLIGHTS)
-
-  useEffect(() => {
-    setHighlights(EMPTY_HIGHLIGHTS)
-    if (!file || !filetype) return
-    let cancelled = false
-    void Promise.all([
-      tokenizeSide(file.additionLines, filetype, themeId),
-      tokenizeSide(file.deletionLines, filetype, themeId),
-    ]).then(([add, del]) => {
-      if (cancelled) return
-      setHighlights({ add, del })
-    })
-    return () => {
-      cancelled = true
-    }
-  }, [file, filetype, themeId])
-
   const splitRef = useRef<SplitViewHandle | null>(null)
   const stackedRef = useRef<StackedViewHandle | null>(null)
 
@@ -140,7 +117,9 @@ export const PierreDiff = forwardRef<PierreDiffHandle, Props>(function PierreDif
   if (!file) {
     return (
       <box flexGrow={1} padding={1}>
-        <text fg={theme.colors['descriptionForeground']}>(could not parse diff)</text>
+        <text fg={theme.colors['descriptionForeground']}>
+          {preparation.preparing ? 'Preparing diff…' : '(could not parse diff)'}
+        </text>
       </box>
     )
   }

package/src/ui/components/diff-renderer/prepare-diff.ts

@@ -0,0 +1,66 @@
+import type { ThemedToken } from 'shiki'
+
+import { type FileDiffMetadata, parsePatchFiles } from '../../../diff-parser'
+import { diffHash } from '../../../git/diff-hash'
+import { filetypeFromPath } from './filetype'
+import { tokenizeSide } from './highlight'
+
+export interface PreparedDiff {
+  hash: string
+  file: FileDiffMetadata | null
+  filetype: string | null
+  highlights: { add: ThemedToken[][]; del: ThemedToken[][] }
+}
+
+interface PrepareOptions {
+  signal?: AbortSignal
+  themeId: string
+  /** Skip Shiki for big files to keep prepare under a few tens of ms. */
+  skipHighlightThreshold?: number
+}
+
+const DEFAULT_SKIP_HIGHLIGHT = 2000
+
+function yieldToEventLoop(): Promise<void> {
+  return new Promise((resolve) => {
+    setImmediate(resolve)
+  })
+}
+
+function throwIfAborted(signal?: AbortSignal): void {
+  if (signal?.aborted) throw new DOMException('Aborted', 'AbortError')
+}
+
+// Lifts the hot path (parse → tokenize) off the synchronous render tree. The
+// parser still blocks briefly on very large diffs, but yielding between parse
+// and each tokenize side keeps other UI updates responsive.
+export async function prepareDiff(
+  diff: string,
+  path: string,
+  opts: PrepareOptions
+): Promise<PreparedDiff> {
+  const hash = diffHash(diff)
+  throwIfAborted(opts.signal)
+  const patches = parsePatchFiles(diff)
+  const file = patches[0]?.files[0] ?? null
+  const filetype = file ? (filetypeFromPath(path) ?? null) : null
+
+  const skipThreshold = opts.skipHighlightThreshold ?? DEFAULT_SKIP_HIGHLIGHT
+  const totalLines = file ? file.additionLines.length + file.deletionLines.length : 0
+  const shouldHighlight = !!file && !!filetype && totalLines <= skipThreshold
+
+  if (!shouldHighlight) {
+    return { file, filetype, hash, highlights: { add: [], del: [] } }
+  }
+
+  await yieldToEventLoop()
+  throwIfAborted(opts.signal)
+  const add = await tokenizeSide(file.additionLines, filetype, opts.themeId)
+  throwIfAborted(opts.signal)
+  await yieldToEventLoop()
+  throwIfAborted(opts.signal)
+  const del = await tokenizeSide(file.deletionLines, filetype, opts.themeId)
+  throwIfAborted(opts.signal)
+
+  return { file, filetype, hash, highlights: { add, del } }
+}