critique 0.1.121 → 0.1.123

package/dist/cli.js

@@ -909,7 +909,7 @@ async function runWebMode(diffContent, options) {
         // after the URL is printed, so the user sees the URL faster.
         const { htmlDesktop, htmlMobile, ogImage } = await captureResponsiveHtml(diffContent, { desktopCols, mobileCols, baseRows, themeName, title: options.title, skipOgImage: true });
         log("Uploading...");
-        const result = await uploadHtml(htmlDesktop, htmlMobile);
+        const result = await uploadHtml(htmlDesktop, htmlMobile, undefined, diffContent);
         log(`\nPreview URL: ${result.url}`);
         log(formatPreviewExpiry(result.expiresInDays));
         if (typeof result.expiresInDays === "number") {
@@ -937,7 +937,7 @@ async function runWebMode(diffContent, options) {
                 const { renderDiffToOgImage } = await import("./image.js");
                 const ogImg = await renderDiffToOgImage(diffContent, {
                     themeName: "github-light",
-                    stabilizeMs: 100,
+                    stabilizeMs: 2000,
                 });
                 if (ogImg) {
                     await uploadOgImage(result.id, ogImg);

package/dist/review/review-app.test.js

@@ -791,11 +791,11 @@ The diagram above should not wrap.`,
          Architecture                                                       
                                                                             
          ┌─────────────┐     ┌─────────────┐     ┌─────────────┐            
-           ┌─────────────┐                                                  
+         ┌─────────────┐                                                    
          │   Client    │────▶│   Router    │────▶│  Handler    │────▶│      
-           Database   │                                                     
+         Database   │                                                       
          └─────────────┘     └─────────────┘     └─────────────┘            
-           └─────────────┘                                                  
+         └─────────────┘                                                    
                                                                             
                                                                             
        src/config.ts +1-0                                                   

package/dist/web-utils.d.ts

@@ -110,7 +110,7 @@ export declare function captureReviewResponsiveHtml(options: {
 /**
  * Upload HTML to the critique.work worker
  */
-export declare function uploadHtml(htmlDesktop: string, htmlMobile: string, ogImage?: Buffer | null): Promise<UploadResult>;
+export declare function uploadHtml(htmlDesktop: string, htmlMobile: string, ogImage?: Buffer | null, patch?: string): Promise<UploadResult>;
 /**
  * Upload OG image to an existing diff via PATCH.
  * Called in the background after the initial upload returns the URL.

package/dist/web-utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"web-utils.d.ts","sourceRoot":"","sources":["../src/web-utils.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"web-utils.d.ts","sourceRoot":"","sources":["../src/web-utils.tsx"],"names":[],"mappings":"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"}

package/dist/web-utils.js

@@ -8,6 +8,7 @@ import fs from "fs";
 import { tmpdir } from "os";
 import { join } from "path";
 import { getResolvedTheme, rgbaToHex } from "./themes.js";
+import { DiffRenderable } from "@opentuah/core";
 import { loadStoredLicenseKey, loadOrCreateOwnerSecret } from "./license.js";
 const execAsync = promisify(exec);
 // Worker URL for uploading HTML previews
@@ -41,39 +42,70 @@ function getContentHeight(root) {
     return Math.ceil(maxBottom);
 }
 /**
- * Wait for async rendering (tree-sitter highlighting etc.) to stabilize.
+ * Find all DiffRenderable instances in the renderer tree.
+ * Walks the tree recursively checking instanceof DiffRenderable.
+ */
+function findDiffRenderables(root) {
+    const results = [];
+    function walk(node) {
+        if (!node.getChildren)
+            return;
+        for (const child of node.getChildren()) {
+            if (child instanceof DiffRenderable) {
+                results.push(child);
+            }
+            walk(child);
+        }
+    }
+    walk(root);
+    return results;
+}
+/**
+ * Wait for tree-sitter syntax highlighting to complete on all diff elements,
+ * then wait for rendering to stabilize (no more requestRender calls).
  *
- * Uses an idle+max model:
- * - Exits when no render requests for `idleMs` (tree-sitter is done)
- * - Hard cap at `maxMs` to prevent unbounded waits on huge diffs
- * - Polls at `pollMs` granularity (finer than the idle threshold)
+ * Two-phase approach:
+ * 1. Wait for DiffRenderable.isHighlighting to become false on all diffs
+ *    (deterministic, exits as soon as tree-sitter is done)
+ * 2. Wait for render idle — no new requestRender calls for idleMs
+ *    (catches deferred rebuilds like DiffRenderable.requestRebuild which
+ *    uses queueMicrotask to schedule buildView + requestRender after
+ *    highlighting completes)
  *
- * The old approach used a single `stabilizeMs` with 100ms polling, which
- * meant stabilizeMs=100 gave only one polling window and could miss late
- * highlights, while stabilizeMs=500 was wastefully slow for small diffs.
+ * Phase 2 is critical because DiffRenderable's split view rebuild happens
+ * asynchronously via microtask AFTER isHighlighting goes false. Without it,
+ * the captured frame may have concealed (unhighlighted) content on one side.
  */
-async function waitForRenderStabilization(renderer, renderOnce, stabilizeMs = 500) {
-    // Derive idle/max from the legacy parameter:
-    // - Interactive TUI (500ms): idleMs=200, maxMs=800
-    // - Web/batch (100ms):       idleMs=80,  maxMs=400
-    const idleMs = Math.max(Math.round(stabilizeMs * 0.4), 60);
-    const maxMs = Math.max(stabilizeMs, Math.round(stabilizeMs * 4));
+async function waitForHighlightAndRenderStabilization(renderer, renderOnce, maxMs = 2000) {
+    const startTime = Date.now();
     const pollMs = 20;
+    const idleMs = 80;
+    // Track render requests to detect when rendering has quiesced
     let lastRenderTime = Date.now();
-    const startTime = lastRenderTime;
     const originalRequestRender = renderer.root.requestRender.bind(renderer.root);
     renderer.root.requestRender = function () {
         lastRenderTime = Date.now();
         originalRequestRender();
     };
-    while (true) {
+    // Do one render cycle to kick off highlighting
+    await renderOnce();
+    // Phase 1: wait for isHighlighting to become false on all diffs
+    while (Date.now() - startTime < maxMs) {
+        const diffs = findDiffRenderables(renderer.root);
+        if (diffs.length === 0 || diffs.every(d => !d.isHighlighting)) {
+            break;
+        }
+        await new Promise(resolve => setTimeout(resolve, pollMs));
+        await renderOnce();
+    }
+    // Phase 2: wait for render to stabilize (catches deferred rebuilds)
+    // Reset the render timestamp so we wait for any post-highlight renders
+    lastRenderTime = Date.now();
+    await renderOnce();
+    while (Date.now() - startTime < maxMs) {
         const now = Date.now();
-        // Exit if idle long enough (no render requests for idleMs)
         if (now - lastRenderTime >= idleMs)
             break;
-        // Exit if hard cap reached
-        if (now - startTime >= maxMs)
-            break;
         await new Promise(resolve => setTimeout(resolve, pollMs));
         await renderOnce();
     }
@@ -203,8 +235,8 @@ async function renderDiffToFrameWithSectionPositions(diffContent, options) {
         resize(options.cols, finalHeight);
         await renderOnce();
     }
-    // Wait for async highlighting to complete (only once at the end)
-    await waitForRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 500);
+    // Wait for tree-sitter highlighting + render stabilization
+    await waitForHighlightAndRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 2000);
     const sectionPositions = [];
     for (let idx = 0; idx < fileNames.length; idx++) {
         const section = fileSectionRefs.get(idx);
@@ -419,7 +451,9 @@ export async function captureResponsiveHtml(diffContent, options) {
     // These act as upper bounds to prevent runaway memory usage
     const desktopRows = Math.max(options.baseRows * 3, 5000);
     const mobileRows = Math.max(Math.ceil(desktopRows * (options.desktopCols / options.mobileCols)), 10000);
-    const stabilizeMs = options.stabilizeMs ?? 100;
+    // With deterministic isHighlighting detection, stabilizeMs is just a safety cap.
+    // The function exits instantly when highlighting completes, so 2000ms is fine.
+    const stabilizeMs = options.stabilizeMs ?? 2000;
     // Run all renders in parallel: desktop HTML, mobile HTML, and OG image
     const ogImagePromise = options.skipOgImage
         ? Promise.resolve(null)
@@ -532,8 +566,8 @@ export async function renderReviewToFrame(options) {
         resize(options.cols, finalHeight);
         await renderOnce();
     }
-    // Wait for async highlighting to complete (only once at the end)
-    await waitForRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 500);
+    // Wait for tree-sitter highlighting + render stabilization
+    await waitForHighlightAndRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 2000);
     // Capture the final frame
     const buffer = renderer.currentRenderBuffer;
     const cursorState = renderer.getCursorState();
@@ -575,7 +609,7 @@ export async function captureReviewResponsiveHtml(options) {
     // These act as upper bounds to prevent runaway memory usage
     const desktopRows = Math.max(options.baseRows * 3, 5000);
     const mobileRows = Math.max(Math.ceil(desktopRows * (options.desktopCols / options.mobileCols)), 10000);
-    const stabilizeMs = options.stabilizeMs ?? 100;
+    const stabilizeMs = options.stabilizeMs ?? 2000;
     // Generate OG image from first few hunks' raw diff (in parallel with HTML renders)
     const ogImagePromise = options.skipOgImage
         ? Promise.resolve(null)
@@ -623,7 +657,7 @@ export async function captureReviewResponsiveHtml(options) {
 /**
  * Upload HTML to the critique.work worker
  */
-export async function uploadHtml(htmlDesktop, htmlMobile, ogImage) {
+export async function uploadHtml(htmlDesktop, htmlMobile, ogImage, patch) {
     const body = {
         html: htmlDesktop,
         htmlMobile,
@@ -632,6 +666,10 @@ export async function uploadHtml(htmlDesktop, htmlMobile, ogImage) {
     if (ogImage) {
         body.ogImage = ogImage.toString("base64");
     }
+    // Include raw unified diff (patch) for programmatic access
+    if (patch) {
+        body.patch = patch;
+    }
     const licenseKey = loadStoredLicenseKey();
     const ownerSecret = loadOrCreateOwnerSecret();
     const headers = {

package/dist/worker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"worker.d.ts","sourceRoot":"","sources":["../src/worker.tsx"],"names":[],"mappings":"AAAA,gCAAgC;AAMhC,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAA;AAG3B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAQ5D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAEnD,KAAK,QAAQ,GAAG;IACd,WAAW,EAAE,WAAW,CAAA;IACxB,iBAAiB,EAAE,MAAM,CAAA;IACzB,qBAAqB,EAAE,MAAM,CAAA;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,EAAE;QAAE,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG;YAAE,QAAQ,IAAI,MAAM,CAAA;SAAE,CAAC;QAAC,GAAG,CAAC,EAAE,EAAE,GAAG,GAAG;YAAE,KAAK,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAA;SAAE,CAAA;KAAE,CAAA;CAChI,CAAA;AAUD,QAAA,MAAM,GAAG;cAAwB,QAAQ;eAAa;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE;yCAAK,CAAA;AAo2B7E,eAAe,GAAG,CAAA"}
+{"version":3,"file":"worker.d.ts","sourceRoot":"","sources":["../src/worker.tsx"],"names":[],"mappings":"AAAA,gCAAgC;AAMhC,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAA;AAG3B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAQ5D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAEnD,KAAK,QAAQ,GAAG;IACd,WAAW,EAAE,WAAW,CAAA;IACxB,iBAAiB,EAAE,MAAM,CAAA;IACzB,qBAAqB,EAAE,MAAM,CAAA;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,EAAE;QAAE,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG;YAAE,QAAQ,IAAI,MAAM,CAAA;SAAE,CAAC;QAAC,GAAG,CAAC,EAAE,EAAE,GAAG,GAAG;YAAE,KAAK,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAA;SAAE,CAAA;KAAE,CAAA;CAChI,CAAA;AAUD,QAAA,MAAM,GAAG;cAAwB,QAAQ;eAAa;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE;yCAAK,CAAA;AAo4B7E,eAAe,GAAG,CAAA"}

package/dist/worker.js

@@ -147,6 +147,12 @@ class CritiqueKv {
     async setMobileHtml(id, html, ttlSeconds) {
         await this.kv.put(`${id}-mobile`, html, ttlSeconds ? { expirationTtl: ttlSeconds } : undefined);
     }
+    async getPatch(id) {
+        return this.kv.get(`${id}-patch`);
+    }
+    async setPatch(id, patch, ttlSeconds) {
+        await this.kv.put(`${id}-patch`, patch, ttlSeconds ? { expirationTtl: ttlSeconds } : undefined);
+    }
     async getOgImage(id) {
         return this.kv.get(`og-${id}`, "arrayBuffer");
     }
@@ -182,6 +188,7 @@ class CritiqueKv {
         await Promise.all([
             this.kv.delete(id),
             this.kv.delete(`${id}-mobile`),
+            this.kv.delete(`${id}-patch`),
             this.kv.delete(`og-${id}`),
             this.kv.delete(`owner:${id}`),
         ]);
@@ -336,6 +343,10 @@ app.post("/upload", async (c) => {
         if (htmlMobile && typeof htmlMobile === "string") {
             await kv.setMobileHtml(id, htmlMobile, ttlSeconds);
         }
+        // Store raw patch (unified diff) if provided
+        if (body.patch && typeof body.patch === "string") {
+            await kv.setPatch(id, body.patch, ttlSeconds);
+        }
         const viewUrl = `${url.origin}/v/${id}`;
         return c.json({
             id,
@@ -539,8 +550,25 @@ app.post("/stripe/webhook", async (c) => {
 // Query params: ?v=desktop or ?v=mobile to select version
 // Server redirects mobile devices to ?v=mobile, client JS also handles redirect
 async function handleView(c) {
-    const id = c.req.param("id");
+    let id = c.req.param("id") || "";
     const kv = new CritiqueKv(c.env.CRITIQUE_KV);
+    // Serve raw patch (unified diff) when URL ends with .patch
+    // e.g. /v/abc123.patch → strips suffix, returns text/plain
+    if (id.endsWith(".patch")) {
+        id = id.slice(0, -".patch".length);
+        if (!id || !/^[a-f0-9]{16,32}$/.test(id)) {
+            return c.text("Invalid ID", 400);
+        }
+        const patch = await kv.getPatch(id);
+        if (!patch) {
+            return c.text("Not found", 404);
+        }
+        return c.text(patch, 200, {
+            "Content-Type": "text/plain; charset=utf-8",
+            "Content-Disposition": `inline; filename="${id}.patch"`,
+            "Cache-Control": "public, max-age=86400",
+        });
+    }
     if (!id || !/^[a-f0-9]{16,32}$/.test(id)) {
         return c.text("Invalid ID", 400);
     }

package/package.json

@@ -2,7 +2,7 @@
   "name": "critique",
   "module": "src/diff.tsx",
   "type": "module",
-  "version": "0.1.121",
+  "version": "0.1.123",
   "license": "MIT",
   "private": false,
   "bin": "./dist/cli.js",
@@ -44,8 +44,8 @@
   "dependencies": {
     "@agentclientprotocol/sdk": "^0.13.1",
     "@clack/prompts": "1.0.0-alpha.9",
-    "@opentuah/core": "0.1.96",
-    "@opentuah/react": "0.1.96",
+    "@opentuah/core": "0.1.97",
+    "@opentuah/react": "0.1.97",
     "@parcel/watcher": "^2.5.6",
     "diff": "^8.0.2",
     "goke": "^6.1.3",

package/src/cli.tsx

@@ -1156,7 +1156,7 @@ async function runWebMode(
 
     log("Uploading...");
 
-    const result = await uploadHtml(htmlDesktop, htmlMobile);
+    const result = await uploadHtml(htmlDesktop, htmlMobile, undefined, diffContent);
 
     log(`\nPreview URL: ${result.url}`);
     log(formatPreviewExpiry(result.expiresInDays));
@@ -1187,7 +1187,7 @@ async function runWebMode(
         const { renderDiffToOgImage } = await import("./image.js");
         const ogImg = await renderDiffToOgImage(diffContent, {
           themeName: "github-light",
-          stabilizeMs: 100,
+          stabilizeMs: 2000,
         });
         if (ogImg) {
           await uploadOgImage(result.id, ogImg);

package/src/review/review-app.test.tsx

@@ -928,11 +928,11 @@ The diagram above should not wrap.`,
          Architecture                                                       
                                                                             
          ┌─────────────┐     ┌─────────────┐     ┌─────────────┐            
-           ┌─────────────┐                                                  
+         ┌─────────────┐                                                    
          │   Client    │────▶│   Router    │────▶│  Handler    │────▶│      
-           Database   │                                                     
+         Database   │                                                       
          └─────────────┘     └─────────────┘     └─────────────┘            
-           └─────────────┘                                                  
+         └─────────────┘                                                    
                                                                             
                                                                             
        src/config.ts +1-0                                                   

package/src/web-utils.tsx

@@ -9,6 +9,7 @@ import { tmpdir } from "os"
 import { join } from "path"
 import { getResolvedTheme, rgbaToHex } from "./themes.js"
 import type { BoxRenderable, CapturedFrame, CapturedLine, RootRenderable, CliRenderer } from "@opentuah/core"
+import { DiffRenderable } from "@opentuah/core"
 import type { IndexedHunk, ReviewYaml } from "./review/types.js"
 import { loadStoredLicenseKey, loadOrCreateOwnerSecret } from "./license.js"
 
@@ -93,43 +94,80 @@ function getContentHeight(root: RootRenderable): number {
 }
 
 /**
- * Wait for async rendering (tree-sitter highlighting etc.) to stabilize.
+ * Find all DiffRenderable instances in the renderer tree.
+ * Walks the tree recursively checking instanceof DiffRenderable.
+ */
+function findDiffRenderables(root: RootRenderable): InstanceType<typeof DiffRenderable>[] {
+  const results: InstanceType<typeof DiffRenderable>[] = []
+
+  function walk(node: { getChildren?: () => any[] }) {
+    if (!node.getChildren) return
+    for (const child of node.getChildren()) {
+      if (child instanceof DiffRenderable) {
+        results.push(child)
+      }
+      walk(child)
+    }
+  }
+
+  walk(root)
+  return results
+}
+
+/**
+ * Wait for tree-sitter syntax highlighting to complete on all diff elements,
+ * then wait for rendering to stabilize (no more requestRender calls).
  *
- * Uses an idle+max model:
- * - Exits when no render requests for `idleMs` (tree-sitter is done)
- * - Hard cap at `maxMs` to prevent unbounded waits on huge diffs
- * - Polls at `pollMs` granularity (finer than the idle threshold)
+ * Two-phase approach:
+ * 1. Wait for DiffRenderable.isHighlighting to become false on all diffs
+ *    (deterministic, exits as soon as tree-sitter is done)
+ * 2. Wait for render idle — no new requestRender calls for idleMs
+ *    (catches deferred rebuilds like DiffRenderable.requestRebuild which
+ *    uses queueMicrotask to schedule buildView + requestRender after
+ *    highlighting completes)
  *
- * The old approach used a single `stabilizeMs` with 100ms polling, which
- * meant stabilizeMs=100 gave only one polling window and could miss late
- * highlights, while stabilizeMs=500 was wastefully slow for small diffs.
+ * Phase 2 is critical because DiffRenderable's split view rebuild happens
+ * asynchronously via microtask AFTER isHighlighting goes false. Without it,
+ * the captured frame may have concealed (unhighlighted) content on one side.
  */
-async function waitForRenderStabilization(
+async function waitForHighlightAndRenderStabilization(
   renderer: CliRenderer,
   renderOnce: () => Promise<void>,
-  stabilizeMs: number = 500
+  maxMs: number = 2000
 ): Promise<void> {
-  // Derive idle/max from the legacy parameter:
-  // - Interactive TUI (500ms): idleMs=200, maxMs=800
-  // - Web/batch (100ms):       idleMs=80,  maxMs=400
-  const idleMs = Math.max(Math.round(stabilizeMs * 0.4), 60)
-  const maxMs = Math.max(stabilizeMs, Math.round(stabilizeMs * 4))
+  const startTime = Date.now()
   const pollMs = 20
+  const idleMs = 80
 
+  // Track render requests to detect when rendering has quiesced
   let lastRenderTime = Date.now()
-  const startTime = lastRenderTime
   const originalRequestRender = renderer.root.requestRender.bind(renderer.root)
   renderer.root.requestRender = function() {
     lastRenderTime = Date.now()
     originalRequestRender()
   }
 
-  while (true) {
+  // Do one render cycle to kick off highlighting
+  await renderOnce()
+
+  // Phase 1: wait for isHighlighting to become false on all diffs
+  while (Date.now() - startTime < maxMs) {
+    const diffs = findDiffRenderables(renderer.root)
+    if (diffs.length === 0 || diffs.every(d => !d.isHighlighting)) {
+      break
+    }
+    await new Promise(resolve => setTimeout(resolve, pollMs))
+    await renderOnce()
+  }
+
+  // Phase 2: wait for render to stabilize (catches deferred rebuilds)
+  // Reset the render timestamp so we wait for any post-highlight renders
+  lastRenderTime = Date.now()
+  await renderOnce()
+
+  while (Date.now() - startTime < maxMs) {
     const now = Date.now()
-    // Exit if idle long enough (no render requests for idleMs)
     if (now - lastRenderTime >= idleMs) break
-    // Exit if hard cap reached
-    if (now - startTime >= maxMs) break
     await new Promise(resolve => setTimeout(resolve, pollMs))
     await renderOnce()
   }
@@ -315,8 +353,8 @@ async function renderDiffToFrameWithSectionPositions(
     await renderOnce()
   }
   
-  // Wait for async highlighting to complete (only once at the end)
-  await waitForRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 500)
+  // Wait for tree-sitter highlighting + render stabilization
+  await waitForHighlightAndRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 2000)
 
   const sectionPositions: FileSectionPosition[] = []
   for (let idx = 0; idx < fileNames.length; idx++) {
@@ -585,7 +623,9 @@ export async function captureResponsiveHtml(
   // These act as upper bounds to prevent runaway memory usage
   const desktopRows = Math.max(options.baseRows * 3, 5000)
   const mobileRows = Math.max(Math.ceil(desktopRows * (options.desktopCols / options.mobileCols)), 10000)
-  const stabilizeMs = options.stabilizeMs ?? 100
+  // With deterministic isHighlighting detection, stabilizeMs is just a safety cap.
+  // The function exits instantly when highlighting completes, so 2000ms is fine.
+  const stabilizeMs = options.stabilizeMs ?? 2000
 
   // Run all renders in parallel: desktop HTML, mobile HTML, and OG image
   const ogImagePromise = options.skipOgImage
@@ -725,8 +765,8 @@ export async function renderReviewToFrame(
     await renderOnce()
   }
   
-  // Wait for async highlighting to complete (only once at the end)
-  await waitForRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 500)
+  // Wait for tree-sitter highlighting + render stabilization
+  await waitForHighlightAndRenderStabilization(renderer, renderOnce, options.stabilizeMs ?? 2000)
 
   // Capture the final frame
   const buffer = renderer.currentRenderBuffer
@@ -792,7 +832,7 @@ export async function captureReviewResponsiveHtml(
   // These act as upper bounds to prevent runaway memory usage
   const desktopRows = Math.max(options.baseRows * 3, 5000)
   const mobileRows = Math.max(Math.ceil(desktopRows * (options.desktopCols / options.mobileCols)), 10000)
-  const stabilizeMs = options.stabilizeMs ?? 100
+  const stabilizeMs = options.stabilizeMs ?? 2000
 
   // Generate OG image from first few hunks' raw diff (in parallel with HTML renders)
   const ogImagePromise = options.skipOgImage
@@ -845,7 +885,8 @@ export async function captureReviewResponsiveHtml(
 export async function uploadHtml(
   htmlDesktop: string,
   htmlMobile: string,
-  ogImage?: Buffer | null
+  ogImage?: Buffer | null,
+  patch?: string,
 ): Promise<UploadResult> {
   const body: Record<string, string> = { 
     html: htmlDesktop, 
@@ -857,6 +898,11 @@ export async function uploadHtml(
     body.ogImage = ogImage.toString("base64")
   }
 
+  // Include raw unified diff (patch) for programmatic access
+  if (patch) {
+    body.patch = patch
+  }
+
   const licenseKey = loadStoredLicenseKey()
   const ownerSecret = loadOrCreateOwnerSecret()
   const headers: Record<string, string> = {

package/src/worker.tsx

@@ -200,6 +200,14 @@ class CritiqueKv {
     await this.kv.put(`${id}-mobile`, html, ttlSeconds ? { expirationTtl: ttlSeconds } : undefined)
   }
 
+  async getPatch(id: string): Promise<string | null> {
+    return this.kv.get(`${id}-patch`)
+  }
+
+  async setPatch(id: string, patch: string, ttlSeconds?: number): Promise<void> {
+    await this.kv.put(`${id}-patch`, patch, ttlSeconds ? { expirationTtl: ttlSeconds } : undefined)
+  }
+
   async getOgImage(id: string): Promise<ArrayBuffer | null> {
     return this.kv.get(`og-${id}`, "arrayBuffer")
   }
@@ -245,6 +253,7 @@ class CritiqueKv {
     await Promise.all([
       this.kv.delete(id),
       this.kv.delete(`${id}-mobile`),
+      this.kv.delete(`${id}-patch`),
       this.kv.delete(`og-${id}`),
       this.kv.delete(`owner:${id}`),
     ])
@@ -376,7 +385,7 @@ function extractTitle(html: string): string {
 app.post("/upload", async (c) => {
   try {
     const kv = new CritiqueKv(c.env.CRITIQUE_KV)
-    const body = await c.req.json<{ html: string; htmlMobile?: string; ogImage?: string }>()
+    const body = await c.req.json<{ html: string; htmlMobile?: string; ogImage?: string; patch?: string }>()
 
     if (!body.html || typeof body.html !== "string") {
       return c.json({ error: "Missing or invalid 'html' field" }, 400)
@@ -433,6 +442,11 @@ app.post("/upload", async (c) => {
       await kv.setMobileHtml(id, htmlMobile, ttlSeconds)
     }
 
+    // Store raw patch (unified diff) if provided
+    if (body.patch && typeof body.patch === "string") {
+      await kv.setPatch(id, body.patch, ttlSeconds)
+    }
+
     const viewUrl = `${url.origin}/v/${id}`
 
     return c.json({
@@ -705,10 +719,28 @@ app.post("/stripe/webhook", async (c) => {
 // Query params: ?v=desktop or ?v=mobile to select version
 // Server redirects mobile devices to ?v=mobile, client JS also handles redirect
 async function handleView(c: any) {
-  const id = c.req.param("id")
+  let id: string = c.req.param("id") || ""
 
   const kv = new CritiqueKv(c.env.CRITIQUE_KV)
 
+  // Serve raw patch (unified diff) when URL ends with .patch
+  // e.g. /v/abc123.patch → strips suffix, returns text/plain
+  if (id.endsWith(".patch")) {
+    id = id.slice(0, -".patch".length)
+    if (!id || !/^[a-f0-9]{16,32}$/.test(id)) {
+      return c.text("Invalid ID", 400)
+    }
+    const patch = await kv.getPatch(id)
+    if (!patch) {
+      return c.text("Not found", 404)
+    }
+    return c.text(patch, 200, {
+      "Content-Type": "text/plain; charset=utf-8",
+      "Content-Disposition": `inline; filename="${id}.patch"`,
+      "Cache-Control": "public, max-age=86400",
+    })
+  }
+
   if (!id || !/^[a-f0-9]{16,32}$/.test(id)) {
     return c.text("Invalid ID", 400)
   }

package/src/.test-stdin-pager-tmp/binary.diff

@@ -1,3 +0,0 @@
-diff --git a/logo.png b/logo.png
-new file mode 100644
-Binary files /dev/null and b/logo.png differ

package/src/.test-stdin-pager-tmp/colored.diff

@@ -1,8 +0,0 @@
-diff --git a/src/hello.ts b/src/hello.ts
---- a/src/hello.ts
-+++ b/src/hello.ts
-@@ -1,3 +1,3 @@
- const greeting = 'hello'
--console.log(greeting)
-+console.log(greeting + ' world')
- export default greeting

package/src/.test-stdin-pager-tmp/context-only.diff

@@ -1,7 +0,0 @@
-diff --git a/readme.md b/readme.md
---- a/readme.md
-+++ b/readme.md
-@@ -1,3 +1,3 @@
- # My Project
- 
- Some description

package/src/.test-stdin-pager-tmp/delete.diff

@@ -1,9 +0,0 @@
-diff --git a/src/deprecated.ts b/src/deprecated.ts
-deleted file mode 100644
---- a/src/deprecated.ts
-+++ /dev/null
-@@ -1,4 +0,0 @@
--// This module is no longer needed
--export function oldHelper() {
--  return 'deprecated'
--}

package/src/.test-stdin-pager-tmp/large.diff

@@ -1,19 +0,0 @@
-diff --git a/config.json b/config.json
---- a/config.json
-+++ b/config.json
-@@ -1,9 +1,11 @@
- {
--  "name": "my-app",
-+  "name": "my-awesome-app",
--  "version": "1.0.0",
-+  "version": "2.0.0",
-   "description": "A sample app",
--  "main": "index.js",
-+  "main": "dist/index.js",
-+  "types": "dist/index.d.ts",
-   "scripts": {
--    "build": "tsc"
-+    "build": "tsc --project tsconfig.build.json",
-+    "test": "bun test"
-   }
- }

package/src/.test-stdin-pager-tmp/multi.diff

@@ -1,20 +0,0 @@
-diff --git a/src/index.ts b/src/index.ts
---- a/src/index.ts
-+++ b/src/index.ts
-@@ -1,4 +1,6 @@
- import { App } from './app'
-+import { Logger } from './logger'
- 
- const app = new App()
-+const logger = new Logger()
- app.start()
-diff --git a/src/logger.ts b/src/logger.ts
-new file mode 100644
---- /dev/null
-+++ b/src/logger.ts
-@@ -0,0 +1,5 @@
-+export class Logger {
-+  log(msg: string) {
-+    console.log(`[LOG] ${msg}`)
-+  }
-+}

package/src/.test-stdin-pager-tmp/newfile.diff

@@ -1,12 +0,0 @@
-diff --git a/src/utils.ts b/src/utils.ts
-new file mode 100644
---- /dev/null
-+++ b/src/utils.ts
-@@ -0,0 +1,7 @@
-+export function clamp(value: number, min: number, max: number): number {
-+  return Math.min(Math.max(value, min), max)
-+}
-+
-+export function identity<T>(x: T): T {
-+  return x
-+}

package/src/.test-stdin-pager-tmp/rename.diff

@@ -1,11 +0,0 @@
-diff --git a/src/old-name.ts b/src/new-name.ts
-similarity index 90%
-rename from src/old-name.ts
-rename to src/new-name.ts
---- a/src/old-name.ts
-+++ b/src/new-name.ts
-@@ -1,3 +1,3 @@
--export const name = 'old'
-+export const name = 'new'
- export const version = 1
- export default name

package/src/.test-stdin-pager-tmp/single.diff

@@ -1,8 +0,0 @@
-diff --git a/src/hello.ts b/src/hello.ts
---- a/src/hello.ts
-+++ b/src/hello.ts
-@@ -1,3 +1,3 @@
- const greeting = 'hello'
--console.log(greeting)
-+console.log(greeting + ' world')
- export default greeting