backlens 0.2.2 → 0.2.3

package/ai/fixes.js

@@ -20,6 +20,9 @@ import { promiseAll } from './templates.js';
  */
 
 // Replaying a write sends it again, so it changes the dev database twice: reads only unless asked.
+// Replays after a fix: warm-up runs first, then measured runs (reads only).
+const WARMUPS = 3;
+const SAMPLES = 5;
 const DEFAULTS = { provider: null, ollamaModel: null, dailyBudgetUsd: 1, replay: true, replayWrites: false };
 const EDIT_REPAIRS = 2;
 const TYPE_REPAIRS = 2;
@@ -483,6 +486,12 @@ export function createAI(deps) {
     return { ok: r.code === 0, errors: r.out };
   }
 
+  const median = (list) => {
+    const xs = [...list].sort((a, b) => a - b);
+    const mid = Math.floor(xs.length / 2);
+    return Math.round((xs.length % 2 ? xs[mid] : (xs[mid - 1] + xs[mid]) / 2) * 100) / 100;
+  };
+
   /** What a request cost: the numbers shown before and after a fix. */
   function stats(trace) {
     const count = (kind) => trace.spans.filter((x) => x.kind === kind).length;
@@ -556,20 +565,33 @@ export function createAI(deps) {
     } else {
       // The app has just restarted, so its first request pays for cold caches and new connections.
       // A read is sent once to warm up, and the second one is measured.
-      if (!isWrite) await replay(job, payload, deps.appPort());
-      const trace = await replay(job, payload, deps.appPort());
+      // A just-restarted app is slow for its first requests (cold code, new database
+      // connections). A read is sent a few times to warm up, then measured several times and the
+      // median kept. A write runs once: replaying it changes data again.
+      const samples = [];
+      if (!isWrite) for (let i = 0; i < WARMUPS; i++) await replay(job, payload, deps.appPort());
+      for (let i = 0; i < (isWrite ? 1 : SAMPLES); i++) {
+        const t = await replay(job, payload, deps.appPort());
+        if (!t) break;
+        samples.push(t);
+      }
+      const trace = samples.at(-1);
       if (!trace) {
         r.status = 'fail';
         r.detail = 'the replayed request did not finish within 20 s';
         return finish(job, false, 'The replayed request did not come back.');
       }
       replayed = true;
-      const still = checkTrace(trace).some((i) => sameIssue(i, job.issue));
+      const still = samples.some((t) => checkTrace(t).some((i) => sameIssue(i, job.issue)));
       const sameClass = original ? Math.floor(trace.status / 100) === Math.floor(original.status / 100) : trace.status < 400;
-      const before = original ? `${original.status} in ${original.duration} ms, ${original.spans.length} calls` : '';
+      // Before: the same route's recorded requests from before the change, not just one of them.
+      const earlier = (deps.routeTraces ? deps.routeTraces(job.issue.route) : []).filter((t) => t.status === (original || trace).status);
+      const beforeList = earlier.length ? earlier.slice(-SAMPLES) : original ? [original] : [];
+      const after = { ...stats(trace), ms: median(samples.map((t) => t.duration)) };
+      const before = beforeList.length ? { ...stats(original || beforeList.at(-1)), ms: median(beforeList.map((t) => t.duration)) } : null;
       r.status = !still && sameClass ? 'done' : 'fail';
-      r.detail = `before: ${before}\nafter:  ${trace.status} in ${trace.duration} ms, ${trace.spans.length} calls${still ? ', issue still there' : ', issue gone'}`;
-      job.compare = { before: original ? stats(original) : null, after: stats(trace), issueGone: !still, warmed: !isWrite };
+      r.detail = `before: ${before ? `${before.status}, median ${before.ms} ms of ${beforeList.length} recorded, ${before.queries} queries` : 'no recorded request'}\nafter:  ${after.status}, median ${after.ms} ms of ${samples.length} replays, ${after.queries} queries${still ? ', issue still there' : ', issue gone'}`;
+      job.compare = { before, after, beforeRuns: beforeList.length, afterRuns: samples.length, issueGone: !still, warmed: !isWrite };
       job.afterTrace = trace;
       if (trace.status === 401 && original && original.status !== 401) r.detail += '\nThe recorded login may have expired: sign in again and use the page once more.';
       if (r.status === 'fail') return finish(job, false, still ? 'The issue is still there after the change.' : `The request now answers ${trace.status}.`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "backlens",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "Run your Node backend through backlens and see every request, every query, and what is wrong with them.",
   "license": "MIT",
   "type": "module",

package/server.js

@@ -422,6 +422,12 @@ export function startServer({ port, root = process.cwd(), token, manualArgv = nu
           return issues.find((i) => i.key === key) || (testRun.report ? testRun.report.issues.find((i) => i.key === key) : null);
         },
         getTrace: (id) => traces.find((t) => t.id === id) || testRun.traces.find((t) => t.id === id),
+        // Recorded requests on a route since the last fix kept there (the code they ran is the
+        // code being changed now), oldest first.
+        routeTraces: (route) => {
+          const since = Math.max(0, ...[...fixedAt].filter(([key]) => key.split('|')[1] === route).map(([, at]) => at));
+          return traces.filter((t) => t.at > since && routeOf(t.method, t.url, t.template) === route);
+        },
         markFixed: (key, after) => {
           fixedAt.set(key, Date.now());
           if (after) {

package/ui.html

@@ -157,7 +157,8 @@
   a.btn { text-decoration: none; display: inline-block; }
   .compare-card { border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; margin: 4px 0 14px; }
   .compare-card h4 { margin: 0 0 8px; font-size: 13px; }
-  .compare-card table { width: auto; border-collapse: collapse; font: 13px var(--mono); }
+  .compare-card table { width: auto; max-width: 100%; border-collapse: collapse; font: 13px var(--mono); margin-bottom: 10px; }
+  .compare-card td, .compare-card th { white-space: nowrap; }
   .compare-card th { text-align: left; font-weight: 400; color: var(--sub); padding: 3px 18px 3px 0; }
   .compare-card td { padding: 3px 10px 3px 0; }
   .compare-card .arrow { color: var(--sub); }
@@ -769,20 +770,20 @@ function compareCard(j) {
   const c = j.compare;
   if (!c || !c.before || !['verified', 'failed', 'unverified', 'kept', 'reverted'].includes(j.stage)) return '';
   const pct = (a, b) => (a ? Math.round(((b - a) / a) * 100) : 0);
-  const row = (label, a, b, fmt = (x) => x, lowerIsBetter = true) => {
+  const row = (label, a, b, fmt = (x) => x, noise = 0) => {
     const d = pct(a, b);
-    const tone = a === b ? 'same' : (b < a) === lowerIsBetter ? 'better' : 'worse';
-    return `<tr><th>${label}</th><td>${fmt(a)}</td><td class="arrow">→</td><td class="${tone}">${fmt(b)}</td><td class="${tone} delta">${a === b ? '' : `${d > 0 ? '+' : ''}${d}%`}</td></tr>`;
+    // Small time differences are noise, not a result: shown plain, not green or red.
+    const tone = a === b || Math.abs(b - a) <= noise ? 'same' : b < a ? 'better' : 'worse';
+    return `<tr><th>${label}</th><td>${fmt(a)}</td><td class="arrow">→</td><td class="${tone}">${fmt(b)}</td><td class="${tone} delta">${tone === 'same' ? '' : `${d > 0 ? '+' : ''}${d}%`}</td></tr>`;
   };
-  const kind = esc((j.issueTitle || '').split(':')[0]);
   return `<section class="compare-card"><h4>Same request, before and after the change</h4><table>
-    ${row('time', c.before.ms, c.after.ms, (x) => ms(x))}
+    ${row('time (median)', c.before.ms, c.after.ms, (x) => ms(x), Math.max(3, c.before.ms * 0.15))}
     ${row('database queries', c.before.queries, c.after.queries)}
     ${c.before.redis || c.after.redis ? row('redis calls', c.before.redis, c.after.redis) : ''}
     ${c.before.http || c.after.http ? row('outgoing http', c.before.http, c.after.http) : ''}
     <tr><th>status</th><td>${c.before.status}</td><td class="arrow">→</td><td class="${c.before.status === c.after.status ? 'same' : 'worse'}">${c.after.status}</td><td></td></tr>
-    <tr><th>issue</th><td>${kind || 'found'}</td><td class="arrow">→</td><td class="${c.issueGone ? 'better' : 'worse'}">${c.issueGone ? 'gone' : 'still there'}</td><td></td></tr>
-  </table><p class="note">One request each${c.warmed ? ', the after one measured once the restarted app was warm' : ''}. Query counts are exact; times vary a few ms from run to run.</p></section>`;
+    <tr><th>issue</th><td>found</td><td class="arrow">→</td><td class="${c.issueGone ? 'better' : 'worse'}">${c.issueGone ? 'gone' : 'still there'}</td><td></td></tr>
+  </table><p class="note">Before: ${c.beforeRuns} recorded request${c.beforeRuns === 1 ? '' : 's'}. After: ${c.afterRuns} replay${c.afterRuns === 1 ? '' : 's'}${c.warmed ? ', after warming the restarted app up' : ''}. Query counts are exact; a time change within a few ms is noise.</p></section>`;
 }
 
 // ---- creating a suggested index from the drawer ----------------------------------------