adonisjs-server-stats 1.1.4 → 1.2.2

package/README.md

@@ -35,6 +35,7 @@ Zero frontend dependencies. Zero build step. Just `@serverStats()` and go.
 
 - **Live stats bar** -- CPU, memory, event loop lag, HTTP throughput, DB pool, Redis, queues, logs
 - **Debug toolbar** -- SQL queries, events, emails, routes, logs with search and filtering
+- **Request tracing** -- per-request waterfall timeline showing DB queries, events, and custom spans
 - **Custom panes** -- add your own tabs (webhooks, emails, cache, anything) with a simple config
 - **Pluggable collectors** -- use built-in collectors or write your own
 - **Visibility control** -- show only to admins, specific roles, or in dev mode
@@ -223,6 +224,8 @@ export default class ServerStatsController {
 | `maxEmails`            | `number`        | `100`   | Max emails to buffer                           |
 | `slowQueryThresholdMs` | `number`        | `100`   | Slow query threshold (ms)                      |
 | `persistDebugData`     | `boolean \| string` | `false` | Persist debug data to disk across restarts. `true` writes to `.adonisjs/server-stats/debug-data.json`, or pass a custom path. |
+| `tracing`              | `boolean`       | `false` | Enable per-request tracing with timeline visualization |
+| `maxTraces`            | `number`        | `200`   | Max request traces to buffer                   |
 | `panes`                | `DebugPane[]`   | --      | Custom debug panel tabs                        |
 
 ---
@@ -372,7 +375,7 @@ Features:
 
 ## Dev Toolbar
 
-Adds a debug panel with SQL query inspection, event tracking, email capture with HTML preview, route table, and live logs. Only active in non-production environments.
+Adds a debug panel with SQL query inspection, event tracking, email capture with HTML preview, route table, live logs, and per-request tracing. Only active in non-production environments.
 
 ```ts
 export default defineConfig({
@@ -383,6 +386,7 @@ export default defineConfig({
     maxEmails: 100,
     slowQueryThresholdMs: 100,
     persistDebugData: true,  // or a custom path: 'custom/debug.json'
+    tracing: true,           // enable per-request timeline
   },
 })
 ```
@@ -398,6 +402,8 @@ router
     router.get('routes', '#controllers/admin/debug_controller.routes')
     router.get('emails', '#controllers/admin/debug_controller.emails')
     router.get('emails/:id/preview', '#controllers/admin/debug_controller.emailPreview')
+    router.get('traces', '#controllers/admin/debug_controller.traces')
+    router.get('traces/:id', '#controllers/admin/debug_controller.traceDetail')
   })
   .prefix('/admin/api/debug')
   .use(middleware.admin())
@@ -414,6 +420,52 @@ Enable `persistDebugData: true` to save queries, events, and emails to `.adonisj
 - **Flushed** every 30 seconds (handles crashes)
 - **Saved** on graceful shutdown
 
+### Request Tracing
+
+When `tracing: true` is set, the debug panel gains a **Timeline** tab that shows a waterfall view of every HTTP request -- which DB queries ran, in what order, and how long each took.
+
+Tracing uses `AsyncLocalStorage` to automatically correlate operations to the request that triggered them. DB queries captured via `db:query` events and `console.warn` calls are automatically attached to the active request trace.
+
+#### How it works
+
+```
+GET /organizations/create    286ms
+├─ SELECT * FROM users          2ms  █
+├─ SELECT * FROM orgs           4ms    █
+├─ fetchMembers (custom)      180ms    ██████████████████
+└─ response sent                5ms                      ██
+```
+
+1. The **Timeline** tab shows a list of recent requests with method, URL, status code, duration, span count, and any warnings
+2. Click a request to see the **waterfall chart** -- each span is a horizontal bar positioned by time offset, color-coded by category
+3. Spans can be nested (a custom span wrapping DB queries will show them indented)
+
+#### Span categories
+
+| Category | Color  | Auto-captured |
+|----------|--------|---------------|
+| DB       | Purple | `db:query` events |
+| Request  | Blue   | Full request lifecycle |
+| Mail     | Green  | -- |
+| Event    | Amber  | -- |
+| View     | Cyan   | -- |
+| Custom   | Gray   | Via `trace()` helper |
+
+#### Custom spans
+
+Use the `trace()` helper to wrap any async code in a named span:
+
+```ts
+import { trace } from 'adonisjs-server-stats'
+
+// In a controller or service:
+const result = await trace('organization.fetchMembers', async () => {
+  return OrganizationService.getMembers(orgId)
+})
+```
+
+If tracing is disabled or no request is active, `trace()` executes the function directly with no overhead.
+
 ### Custom Debug Panes
 
 Add custom tabs to the debug panel:
@@ -573,8 +625,13 @@ import type {
   EventRecord,
   EmailRecord,
   RouteRecord,
+  TraceSpan,
+  TraceRecord,
 } from 'adonisjs-server-stats'
 
+// Trace helper
+import { trace } from 'adonisjs-server-stats'
+
 // Collector option types
 import type {
   HttpCollectorOptions,

package/dist/src/controller/debug_controller.d.ts

@@ -8,5 +8,7 @@ export default class DebugController {
     routes({ response }: HttpContext): Promise<void>;
     emails({ response }: HttpContext): Promise<void>;
     emailPreview({ params, response }: HttpContext): Promise<void>;
+    traces({ response }: HttpContext): Promise<void>;
+    traceDetail({ params, response }: HttpContext): Promise<void>;
 }
 //# sourceMappingURL=debug_controller.d.ts.map

package/dist/src/controller/debug_controller.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"debug_controller.d.ts","sourceRoot":"","sources":["../../../src/controller/debug_controller.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,MAAM,CAAC,OAAO,OAAO,eAAe;IACtB,OAAO,CAAC,KAAK;gBAAL,KAAK,EAAE,UAAU;IAE/B,OAAO,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAMjC,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAKhC,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAKhC,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAOhC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,WAAW;CAQrD"}
+{"version":3,"file":"debug_controller.d.ts","sourceRoot":"","sources":["../../../src/controller/debug_controller.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,MAAM,CAAC,OAAO,OAAO,eAAe;IACtB,OAAO,CAAC,KAAK;gBAAL,KAAK,EAAE,UAAU;IAE/B,OAAO,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAMjC,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAKhC,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAKhC,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAOhC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,WAAW;IAS9C,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW;IAahC,WAAW,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,WAAW;CAWpD"}

package/dist/src/controller/debug_controller.js

@@ -30,4 +30,27 @@ export default class DebugController {
         }
         return response.header('Content-Type', 'text/html; charset=utf-8').send(html);
     }
+    async traces({ response }) {
+        if (!this.store.traces) {
+            return response.json({ traces: [], total: 0 });
+        }
+        const traces = this.store.traces.getLatest(100);
+        // Strip spans from list view to keep it lightweight
+        const list = traces.map(({ spans, warnings, ...rest }) => ({
+            ...rest,
+            warningCount: warnings.length,
+        }));
+        return response.json({ traces: list, total: this.store.traces.getTotalCount() });
+    }
+    async traceDetail({ params, response }) {
+        if (!this.store.traces) {
+            return response.notFound({ error: 'Tracing not enabled' });
+        }
+        const id = Number(params.id);
+        const trace = this.store.traces.getTrace(id);
+        if (!trace) {
+            return response.notFound({ error: 'Trace not found' });
+        }
+        return response.json(trace);
+    }
 }

package/dist/src/debug/debug_store.d.ts

@@ -2,6 +2,7 @@ import { QueryCollector } from "./query_collector.js";
 import { EventCollector } from "./event_collector.js";
 import { EmailCollector } from "./email_collector.js";
 import { RouteInspector } from "./route_inspector.js";
+import { TraceCollector } from "./trace_collector.js";
 import type { DevToolbarConfig } from "./types.js";
 /**
  * Singleton store holding all debug data collectors.
@@ -12,6 +13,7 @@ export declare class DebugStore {
     readonly events: EventCollector;
     readonly emails: EmailCollector;
     readonly routes: RouteInspector;
+    readonly traces: TraceCollector | null;
     constructor(config: DevToolbarConfig);
     start(emitter: any, router: any): Promise<void>;
     stop(): void;

package/dist/src/debug/debug_store.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"debug_store.d.ts","sourceRoot":"","sources":["../../../src/debug/debug_store.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAEnD;;;GAGG;AACH,qBAAa,UAAU;IACrB,QAAQ,CAAC,OAAO,EAAE,cAAc,CAAC;IACjC,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAC;gBAEpB,MAAM,EAAE,gBAAgB;IAU9B,KAAK,CAAC,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,GAAG,OAAO,CAAC,IAAI,CAAC;IAOrD,IAAI,IAAI,IAAI;IAMZ,kEAAkE;IAC5D,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAajD,uDAAuD;IACjD,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;CAoBpD"}
+{"version":3,"file":"debug_store.d.ts","sourceRoot":"","sources":["../../../src/debug/debug_store.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAEnD;;;GAGG;AACH,qBAAa,UAAU;IACrB,QAAQ,CAAC,OAAO,EAAE,cAAc,CAAC;IACjC,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI,CAAC;gBAE3B,MAAM,EAAE,gBAAgB;IAW9B,KAAK,CAAC,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,GAAG,OAAO,CAAC,IAAI,CAAC;IAQrD,IAAI,IAAI,IAAI;IAOZ,kEAAkE;IAC5D,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAgBjD,uDAAuD;IACjD,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;CAuBpD"}

package/dist/src/debug/debug_store.js

@@ -4,6 +4,7 @@ import { QueryCollector } from "./query_collector.js";
 import { EventCollector } from "./event_collector.js";
 import { EmailCollector } from "./email_collector.js";
 import { RouteInspector } from "./route_inspector.js";
+import { TraceCollector } from "./trace_collector.js";
 /**
  * Singleton store holding all debug data collectors.
  * Bound to the AdonisJS container as `debug.store`.
@@ -13,22 +14,26 @@ export class DebugStore {
     events;
     emails;
     routes;
+    traces;
     constructor(config) {
         this.queries = new QueryCollector(config.maxQueries, config.slowQueryThresholdMs);
         this.events = new EventCollector(config.maxEvents);
         this.emails = new EmailCollector(config.maxEmails);
         this.routes = new RouteInspector();
+        this.traces = config.tracing ? new TraceCollector(config.maxTraces) : null;
     }
     async start(emitter, router) {
         await this.queries.start(emitter);
         this.events.start(emitter);
         await this.emails.start(emitter);
         this.routes.inspect(router);
+        this.traces?.start(emitter);
     }
     stop() {
         this.queries.stop();
         this.events.stop();
         this.emails.stop();
+        this.traces?.stop();
     }
     /** Serialize all collector data to a JSON file (atomic write). */
     async saveToDisk(filePath) {
@@ -37,6 +42,9 @@ export class DebugStore {
             events: this.events.getEvents(),
             emails: this.emails.getEmails(),
         };
+        if (this.traces) {
+            data.traces = this.traces.getTraces();
+        }
         const json = JSON.stringify(data);
         const tmpPath = filePath + ".tmp";
         await mkdir(dirname(filePath), { recursive: true });
@@ -62,5 +70,8 @@ export class DebugStore {
         if (Array.isArray(data.emails) && data.emails.length > 0) {
             this.emails.loadRecords(data.emails);
         }
+        if (this.traces && Array.isArray(data.traces) && data.traces.length > 0) {
+            this.traces.loadRecords(data.traces);
+        }
     }
 }

package/dist/src/debug/trace_collector.d.ts

@@ -0,0 +1,51 @@
+import type { TraceSpan, TraceRecord } from './types.js';
+/**
+ * Wrap an async function in a traced span.
+ *
+ * If tracing is not enabled or no request is active, the function
+ * is executed directly without overhead.
+ *
+ * @example
+ * ```ts
+ * import { trace } from 'adonisjs-server-stats'
+ *
+ * const result = await trace('fetchMembers', async () => {
+ *   return OrganizationService.getMembers(orgId)
+ * })
+ * ```
+ */
+export declare function trace<T>(label: string, fn: () => Promise<T>): Promise<T>;
+/**
+ * Collects per-request traces using AsyncLocalStorage.
+ *
+ * Automatically captures DB queries and console.warn calls within
+ * the request context. Users can add custom spans via {@link trace}.
+ */
+export declare class TraceCollector {
+    private buffer;
+    private als;
+    private emitter;
+    private dbHandler;
+    private originalConsoleWarn;
+    constructor(maxTraces?: number);
+    /** Start a new trace context for an HTTP request. */
+    startTrace(callback: () => Promise<void>): Promise<void>;
+    /** Finish the current trace and save it to the ring buffer. */
+    finishTrace(method: string, url: string, statusCode: number): void;
+    /** Add a span to the current trace (if active). */
+    addSpan(label: string, category: TraceSpan['category'], startOffset: number, duration: number, metadata?: Record<string, any>): void;
+    /** Wrap a function in a traced span with automatic nesting. */
+    span<T>(label: string, category: TraceSpan['category'], fn: () => Promise<T>): Promise<T>;
+    /** Hook into db:query events and console.warn to auto-create spans. */
+    start(emitter: any): void;
+    /** Unhook event listeners and restore console.warn. */
+    stop(): void;
+    getTraces(): TraceRecord[];
+    getLatest(n: number): TraceRecord[];
+    getTrace(id: number): TraceRecord | undefined;
+    getTotalCount(): number;
+    clear(): void;
+    /** Restore persisted records into the buffer and reset the ID counter. */
+    loadRecords(records: TraceRecord[]): void;
+}
+//# sourceMappingURL=trace_collector.d.ts.map

package/dist/src/debug/trace_collector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"trace_collector.d.ts","sourceRoot":"","sources":["../../../src/debug/trace_collector.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAmBxD;;;;;;;;;;;;;;GAcG;AACH,wBAAsB,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAG9E;AAED;;;;;GAKG;AACH,qBAAa,cAAc;IACzB,OAAO,CAAC,MAAM,CAAyB;IACvC,OAAO,CAAC,GAAG,CAAwC;IACnD,OAAO,CAAC,OAAO,CAAY;IAC3B,OAAO,CAAC,SAAS,CAAqC;IACtD,OAAO,CAAC,mBAAmB,CAAmC;gBAElD,SAAS,GAAE,MAAY;IAKnC,qDAAqD;IACrD,UAAU,CAAC,QAAQ,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAWxD,+DAA+D;IAC/D,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,IAAI;IAqBlE,mDAAmD;IACnD,OAAO,CACL,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,SAAS,CAAC,UAAU,CAAC,EAC/B,WAAW,EAAE,MAAM,EACnB,QAAQ,EAAE,MAAM,EAChB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAC7B,IAAI;IAeP,+DAA+D;IACzD,IAAI,CAAC,CAAC,EACV,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,SAAS,CAAC,UAAU,CAAC,EAC/B,EAAE,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,GACnB,OAAO,CAAC,CAAC,CAAC;IAyBb,uEAAuE;IACvE,KAAK,CAAC,OAAO,EAAE,GAAG,GAAG,IAAI;IAsCzB,uDAAuD;IACvD,IAAI,IAAI,IAAI;IAaZ,SAAS,IAAI,WAAW,EAAE;IAI1B,SAAS,CAAC,CAAC,EAAE,MAAM,GAAG,WAAW,EAAE;IAInC,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS;IAI7C,aAAa,IAAI,MAAM;IAIvB,KAAK,IAAI,IAAI;IAIb,0EAA0E;IAC1E,WAAW,CAAC,OAAO,EAAE,WAAW,EAAE,GAAG,IAAI;CAK1C"}

package/dist/src/debug/trace_collector.js

@@ -0,0 +1,181 @@
+import { AsyncLocalStorage } from 'node:async_hooks';
+import { performance } from 'node:perf_hooks';
+import { RingBuffer } from './ring_buffer.js';
+/**
+ * Module-level singleton reference for the `trace()` helper.
+ */
+let globalTraceCollector = null;
+/**
+ * Wrap an async function in a traced span.
+ *
+ * If tracing is not enabled or no request is active, the function
+ * is executed directly without overhead.
+ *
+ * @example
+ * ```ts
+ * import { trace } from 'adonisjs-server-stats'
+ *
+ * const result = await trace('fetchMembers', async () => {
+ *   return OrganizationService.getMembers(orgId)
+ * })
+ * ```
+ */
+export async function trace(label, fn) {
+    if (!globalTraceCollector)
+        return fn();
+    return globalTraceCollector.span(label, 'custom', fn);
+}
+/**
+ * Collects per-request traces using AsyncLocalStorage.
+ *
+ * Automatically captures DB queries and console.warn calls within
+ * the request context. Users can add custom spans via {@link trace}.
+ */
+export class TraceCollector {
+    buffer;
+    als = new AsyncLocalStorage();
+    emitter = null;
+    dbHandler = null;
+    originalConsoleWarn = null;
+    constructor(maxTraces = 200) {
+        this.buffer = new RingBuffer(maxTraces);
+        globalTraceCollector = this;
+    }
+    /** Start a new trace context for an HTTP request. */
+    startTrace(callback) {
+        const ctx = {
+            requestStart: performance.now(),
+            spans: [],
+            warnings: [],
+            nextSpanId: 1,
+            currentSpanId: null,
+        };
+        return this.als.run(ctx, callback);
+    }
+    /** Finish the current trace and save it to the ring buffer. */
+    finishTrace(method, url, statusCode) {
+        const ctx = this.als.getStore();
+        if (!ctx)
+            return;
+        const totalDuration = performance.now() - ctx.requestStart;
+        const record = {
+            id: this.buffer.getNextId(),
+            method,
+            url,
+            statusCode,
+            totalDuration: Math.round(totalDuration * 100) / 100,
+            spanCount: ctx.spans.length,
+            spans: ctx.spans,
+            warnings: ctx.warnings,
+            timestamp: Date.now(),
+        };
+        this.buffer.push(record);
+    }
+    /** Add a span to the current trace (if active). */
+    addSpan(label, category, startOffset, duration, metadata) {
+        const ctx = this.als.getStore();
+        if (!ctx)
+            return;
+        ctx.spans.push({
+            id: String(ctx.nextSpanId++),
+            parentId: ctx.currentSpanId,
+            label,
+            category,
+            startOffset: Math.round(startOffset * 100) / 100,
+            duration: Math.round(duration * 100) / 100,
+            metadata,
+        });
+    }
+    /** Wrap a function in a traced span with automatic nesting. */
+    async span(label, category, fn) {
+        const ctx = this.als.getStore();
+        if (!ctx)
+            return fn();
+        const start = performance.now();
+        const parentId = ctx.currentSpanId;
+        const spanId = String(ctx.nextSpanId++);
+        ctx.currentSpanId = spanId;
+        try {
+            return await fn();
+        }
+        finally {
+            const duration = performance.now() - start;
+            ctx.spans.push({
+                id: spanId,
+                parentId,
+                label,
+                category,
+                startOffset: Math.round((start - ctx.requestStart) * 100) / 100,
+                duration: Math.round(duration * 100) / 100,
+            });
+            ctx.currentSpanId = parentId;
+        }
+    }
+    /** Hook into db:query events and console.warn to auto-create spans. */
+    start(emitter) {
+        this.emitter = emitter;
+        if (emitter && typeof emitter.on === 'function') {
+            this.dbHandler = (data) => {
+                const ctx = this.als.getStore();
+                if (!ctx)
+                    return;
+                const duration = typeof data.duration === 'number'
+                    ? data.duration
+                    : Array.isArray(data.duration)
+                        ? data.duration[0] * 1e3 + data.duration[1] / 1e6
+                        : 0;
+                const offset = performance.now() - ctx.requestStart - duration;
+                this.addSpan(data.sql || 'query', 'db', offset, duration, {
+                    method: data.method,
+                    model: data.model,
+                    connection: data.connection,
+                });
+            };
+            emitter.on('db:query', this.dbHandler);
+        }
+        // Intercept console.warn to capture warnings per-request
+        this.originalConsoleWarn = console.warn;
+        const self = this;
+        console.warn = function (...args) {
+            const ctx = self.als.getStore();
+            if (ctx) {
+                ctx.warnings.push(args.map(String).join(' '));
+            }
+            self.originalConsoleWarn.apply(console, args);
+        };
+    }
+    /** Unhook event listeners and restore console.warn. */
+    stop() {
+        if (this.emitter && this.dbHandler) {
+            this.emitter.off('db:query', this.dbHandler);
+        }
+        if (this.originalConsoleWarn) {
+            console.warn = this.originalConsoleWarn;
+        }
+        this.dbHandler = null;
+        this.emitter = null;
+        this.originalConsoleWarn = null;
+        globalTraceCollector = null;
+    }
+    getTraces() {
+        return this.buffer.toArray();
+    }
+    getLatest(n) {
+        return this.buffer.latest(n);
+    }
+    getTrace(id) {
+        return this.buffer.toArray().find((t) => t.id === id);
+    }
+    getTotalCount() {
+        return this.buffer.size();
+    }
+    clear() {
+        this.buffer.clear();
+    }
+    /** Restore persisted records into the buffer and reset the ID counter. */
+    loadRecords(records) {
+        this.buffer.load(records);
+        const maxId = records.reduce((m, r) => Math.max(m, r.id), 0);
+        this.buffer.setNextId(maxId + 1);
+    }
+}

package/dist/src/debug/types.d.ts

@@ -96,6 +96,54 @@ export interface RouteRecord {
      */
     middleware: string[];
 }
+/**
+ * A single span within a request trace.
+ *
+ * Represents a timed operation (DB query, middleware, custom code block)
+ * that occurred during an HTTP request. Spans can be nested via `parentId`.
+ */
+export interface TraceSpan {
+    /** Unique span ID within the trace. */
+    id: string;
+    /** Parent span ID, or `null` for root-level spans. */
+    parentId: string | null;
+    /** Human-readable label (e.g. `"SELECT * FROM users"`, `"auth middleware"`). */
+    label: string;
+    /** Category for color-coding and grouping in the timeline. */
+    category: 'request' | 'middleware' | 'db' | 'view' | 'mail' | 'event' | 'custom';
+    /** Milliseconds from request start to span start. */
+    startOffset: number;
+    /** Span duration in milliseconds. */
+    duration: number;
+    /** Optional metadata (query bindings, status code, etc.). */
+    metadata?: Record<string, any>;
+}
+/**
+ * A complete trace for a single HTTP request.
+ *
+ * Contains all spans captured during the request lifecycle,
+ * stored in a {@link RingBuffer} by the {@link TraceCollector}.
+ */
+export interface TraceRecord {
+    /** Auto-incrementing sequence number. */
+    id: number;
+    /** HTTP method (e.g. `'GET'`, `'POST'`). */
+    method: string;
+    /** Request URL including query string. */
+    url: string;
+    /** HTTP response status code. */
+    statusCode: number;
+    /** Total request duration in milliseconds. */
+    totalDuration: number;
+    /** Number of spans captured. */
+    spanCount: number;
+    /** All spans captured during this request. */
+    spans: TraceSpan[];
+    /** Warnings captured via `console.warn` during this request. */
+    warnings: string[];
+    /** Unix timestamp in **milliseconds** when the request started. */
+    timestamp: number;
+}
 /**
  * Resolved dev toolbar configuration with all defaults applied.
  *
@@ -115,6 +163,10 @@ export interface DevToolbarConfig {
     slowQueryThresholdMs: number;
     /** Whether/where to persist debug data to disk across restarts. */
     persistDebugData: boolean | string;
+    /** Whether per-request tracing is enabled. */
+    tracing: boolean;
+    /** Maximum traces to keep in the ring buffer. */
+    maxTraces: number;
 }
 /**
  * Color names available for the `badge` column format.

package/dist/src/debug/types.d.ts.map

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

package/dist/src/edge/client/debug-panel.css

@@ -6,7 +6,7 @@
   position: fixed;
   inset-inline: 0;
   bottom: 28px;
-  z-index: 49;
+  z-index: 147;
   height: 50vh;
   display: none;
   flex-direction: column;
@@ -317,7 +317,7 @@
   display: flex;
   flex-direction: column;
   background: #0f0f0f;
-  z-index: 10;
+  z-index: 30;
 }
 .ss-dbg-email-preview-header {
   display: flex;
@@ -363,6 +363,124 @@
 /* Filterable cell */
 .ss-dbg-filterable:hover { background: rgba(52, 211, 153, 0.08); }
 
+/* Timeline */
+.ss-dbg-tl-detail-header {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 8px 12px;
+  border-bottom: 1px solid #262626;
+  background: #141414;
+  flex-shrink: 0;
+}
+#ss-dbg-tl-waterfall {
+  padding: 8px 12px;
+  overflow: auto;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+#ss-dbg-tl-waterfall::-webkit-scrollbar { display: none; }
+
+.ss-dbg-tl-row {
+  display: flex;
+  align-items: center;
+  height: 24px;
+  font-size: 11px;
+  border-bottom: 1px solid #1a1a1a;
+}
+.ss-dbg-tl-row:hover { background: rgba(38, 38, 38, 0.4); }
+.ss-dbg-tl-label {
+  width: 280px;
+  min-width: 280px;
+  padding-right: 8px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #a3a3a3;
+  font-size: 10px;
+}
+.ss-dbg-tl-track {
+  flex: 1;
+  position: relative;
+  height: 16px;
+}
+.ss-dbg-tl-bar {
+  position: absolute;
+  height: 12px;
+  top: 2px;
+  border-radius: 2px;
+  min-width: 2px;
+  cursor: default;
+}
+.ss-dbg-tl-bar-request { background: #1e3a5f; }
+.ss-dbg-tl-bar-middleware { background: #1e3a5f; opacity: 0.7; }
+.ss-dbg-tl-bar-db { background: #6d28d9; }
+.ss-dbg-tl-bar-view { background: #0e7490; }
+.ss-dbg-tl-bar-mail { background: #059669; }
+.ss-dbg-tl-bar-event { background: #b45309; }
+.ss-dbg-tl-bar-custom { background: #525252; }
+
+.ss-dbg-tl-dur {
+  font-size: 10px;
+  color: #525252;
+  margin-left: 4px;
+  white-space: nowrap;
+  font-variant-numeric: tabular-nums;
+}
+
+.ss-dbg-tl-legend {
+  display: flex;
+  gap: 12px;
+  padding: 6px 12px;
+  border-bottom: 1px solid #262626;
+  background: #141414;
+  font-size: 10px;
+  color: #737373;
+}
+.ss-dbg-tl-legend-item {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+.ss-dbg-tl-legend-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 2px;
+  flex-shrink: 0;
+}
+
+.ss-dbg-tl-warnings {
+  margin-top: 12px;
+  padding: 8px 12px;
+  border-top: 1px solid #262626;
+}
+.ss-dbg-tl-warnings-title {
+  font-size: 10px;
+  font-weight: 600;
+  color: #fbbf24;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  margin-bottom: 4px;
+}
+.ss-dbg-tl-warning {
+  font-size: 11px;
+  color: #fbbf24;
+  padding: 2px 0;
+}
+
+.ss-dbg-tl-meta {
+  font-size: 10px;
+  color: #525252;
+  margin-left: 8px;
+}
+
+/* Status code badges */
+.ss-dbg-status { font-size: 10px; font-weight: 600; padding: 1px 5px; border-radius: 3px; }
+.ss-dbg-status-2xx { background: #064e3b; color: #34d399; }
+.ss-dbg-status-3xx { background: #1e3a5f; color: #60a5fa; }
+.ss-dbg-status-4xx { background: #422006; color: #fbbf24; }
+.ss-dbg-status-5xx { background: #450a0a; color: #f87171; }
+
 /* Wrench button in stats bar */
 .ss-dbg-btn {
   display: flex;

package/dist/src/edge/client/debug-panel.js

@@ -18,8 +18,10 @@
 
   const LOGS_ENDPOINT = panel.dataset.logsEndpoint || (BASE + '/logs');
 
+  const tracingEnabled = panel.dataset.tracing === '1';
+
   let isOpen = false;
-  let activeTab = 'queries';
+  let activeTab = tracingEnabled ? 'timeline' : 'queries';
   const fetched = {};
   let refreshTimer = null;
   let logFilter = 'all';
@@ -185,7 +187,8 @@
 
   // ── Data loading ────────────────────────────────────────────────
   const loadTab = (name) => {
-    if (name === 'queries') fetchQueries();
+    if (name === 'timeline') fetchTraces();
+    else if (name === 'queries') fetchQueries();
     else if (name === 'events') fetchEvents();
     else if (name === 'routes' && !fetched.routes) fetchRoutes();
     else if (name === 'logs') fetchLogs();
@@ -697,6 +700,194 @@
     });
   }
 
+  // ── Timeline Tab ────────────────────────────────────────────────
+  const tlSearchInput = document.getElementById('ss-dbg-search-timeline');
+  const tlSummaryEl = document.getElementById('ss-dbg-timeline-summary');
+  const tlBodyEl = document.getElementById('ss-dbg-timeline-body');
+  const tlListEl = document.getElementById('ss-dbg-timeline-list');
+  const tlDetailEl = document.getElementById('ss-dbg-timeline-detail');
+  const tlBackBtn = document.getElementById('ss-dbg-tl-back');
+  const tlDetailTitle = document.getElementById('ss-dbg-tl-detail-title');
+  const tlWaterfall = document.getElementById('ss-dbg-tl-waterfall');
+  let cachedTraces = { traces: [], total: 0 };
+
+  const statusClass = (code) => {
+    if (code >= 500) return 'ss-dbg-status-5xx';
+    if (code >= 400) return 'ss-dbg-status-4xx';
+    if (code >= 300) return 'ss-dbg-status-3xx';
+    return 'ss-dbg-status-2xx';
+  };
+
+  const fetchTraces = () => {
+    if (!tracingEnabled) return;
+    fetchJSON(BASE + '/traces')
+      .then((data) => {
+        cachedTraces = data;
+        renderTraces();
+      })
+      .catch(() => {
+        if (tlBodyEl) tlBodyEl.innerHTML = '<div class="ss-dbg-empty">Failed to load traces</div>';
+      });
+  };
+
+  const renderTraces = () => {
+    if (!tlBodyEl) return;
+    const filter = (tlSearchInput ? tlSearchInput.value : '').toLowerCase();
+    const traces = cachedTraces.traces || [];
+
+    if (tlSummaryEl) {
+      tlSummaryEl.textContent = cachedTraces.total + ' requests';
+    }
+
+    let filtered = traces;
+    if (filter) {
+      filtered = traces.filter((t) =>
+        t.url.toLowerCase().indexOf(filter) !== -1
+        || t.method.toLowerCase().indexOf(filter) !== -1
+      );
+    }
+
+    if (filtered.length === 0) {
+      tlBodyEl.innerHTML = '<div class="ss-dbg-empty">' + (filter ? 'No matching requests' : 'No requests traced yet') + '</div>';
+      return;
+    }
+
+    let html = '<table class="ss-dbg-table"><thead><tr>'
+      + '<th style="width:40px">#</th>'
+      + '<th style="width:60px">Method</th>'
+      + '<th>URL</th>'
+      + '<th style="width:55px">Status</th>'
+      + '<th style="width:70px">Duration</th>'
+      + '<th style="width:50px">Spans</th>'
+      + '<th style="width:30px" title="Warnings">&#x26A0;</th>'
+      + '<th style="width:70px">Time</th>'
+      + '</tr></thead><tbody>';
+
+    for (let i = 0; i < filtered.length; i++) {
+      const t = filtered[i];
+      html += '<tr class="ss-dbg-email-row" data-trace-id="' + t.id + '">'
+        + '<td style="color:#525252">' + t.id + '</td>'
+        + '<td><span class="' + methodClass(t.method) + '">' + esc(t.method) + '</span></td>'
+        + '<td style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px" title="' + esc(t.url) + '">' + esc(t.url) + '</td>'
+        + '<td><span class="ss-dbg-status ' + statusClass(t.statusCode) + '">' + t.statusCode + '</span></td>'
+        + '<td class="ss-dbg-duration ' + durationClass(t.totalDuration) + '">' + t.totalDuration.toFixed(1) + 'ms</td>'
+        + '<td style="color:#737373;text-align:center">' + t.spanCount + '</td>'
+        + '<td style="text-align:center">' + (t.warningCount > 0 ? '<span style="color:#fbbf24">' + t.warningCount + '</span>' : '<span style="color:#333">-</span>') + '</td>'
+        + '<td class="ss-dbg-event-time">' + timeAgo(t.timestamp) + '</td>'
+        + '</tr>';
+    }
+
+    html += '</tbody></table>';
+    tlBodyEl.innerHTML = html;
+
+    // Click row to open detail
+    tlBodyEl.querySelectorAll('[data-trace-id]').forEach((row) => {
+      row.addEventListener('click', () => {
+        const id = row.getAttribute('data-trace-id');
+        fetchTraceDetail(id);
+      });
+    });
+  };
+
+  const fetchTraceDetail = (id) => {
+    fetchJSON(BASE + '/traces/' + id)
+      .then((trace) => {
+        showTimeline(trace);
+      })
+      .catch(() => {
+        if (tlWaterfall) tlWaterfall.innerHTML = '<div class="ss-dbg-empty">Failed to load trace</div>';
+      });
+  };
+
+  const showTimeline = (trace) => {
+    if (!tlListEl || !tlDetailEl || !tlDetailTitle || !tlWaterfall) return;
+
+    tlListEl.style.display = 'none';
+    tlDetailEl.style.display = '';
+
+    tlDetailTitle.innerHTML =
+      '<span class="' + methodClass(trace.method) + '">' + esc(trace.method) + '</span> '
+      + esc(trace.url) + ' '
+      + '<span class="ss-dbg-status ' + statusClass(trace.statusCode) + '">' + trace.statusCode + '</span>'
+      + '<span class="ss-dbg-tl-meta">' + trace.totalDuration.toFixed(1) + 'ms &middot; '
+      + trace.spanCount + ' spans &middot; '
+      + formatTime(trace.timestamp) + '</span>';
+
+    const spans = trace.spans || [];
+    const total = trace.totalDuration || 1;
+
+    // Legend
+    let html = '<div class="ss-dbg-tl-legend">'
+      + '<div class="ss-dbg-tl-legend-item"><span class="ss-dbg-tl-legend-dot" style="background:#6d28d9"></span>DB</div>'
+      + '<div class="ss-dbg-tl-legend-item"><span class="ss-dbg-tl-legend-dot" style="background:#1e3a5f"></span>Request</div>'
+      + '<div class="ss-dbg-tl-legend-item"><span class="ss-dbg-tl-legend-dot" style="background:#059669"></span>Mail</div>'
+      + '<div class="ss-dbg-tl-legend-item"><span class="ss-dbg-tl-legend-dot" style="background:#b45309"></span>Event</div>'
+      + '<div class="ss-dbg-tl-legend-item"><span class="ss-dbg-tl-legend-dot" style="background:#0e7490"></span>View</div>'
+      + '<div class="ss-dbg-tl-legend-item"><span class="ss-dbg-tl-legend-dot" style="background:#525252"></span>Custom</div>'
+      + '</div>';
+
+    if (spans.length === 0) {
+      html += '<div class="ss-dbg-empty">No spans captured for this request</div>';
+    } else {
+      // Build nesting depth from parentId
+      const depthMap = {};
+      for (let i = 0; i < spans.length; i++) {
+        const s = spans[i];
+        if (!s.parentId) {
+          depthMap[s.id] = 0;
+        } else {
+          depthMap[s.id] = (depthMap[s.parentId] || 0) + 1;
+        }
+      }
+
+      // Sort by startOffset
+      const sorted = spans.slice().sort((a, b) => a.startOffset - b.startOffset);
+
+      for (let i = 0; i < sorted.length; i++) {
+        const s = sorted[i];
+        const depth = depthMap[s.id] || 0;
+        const leftPct = (s.startOffset / total * 100).toFixed(2);
+        const widthPct = Math.max(s.duration / total * 100, 0.5).toFixed(2);
+        const indent = depth * 16;
+        const catLabel = s.category === 'db' ? 'DB' : s.category;
+        const metaStr = s.metadata ? Object.entries(s.metadata).filter(([,v]) => v != null).map(([k,v]) => k + '=' + v).join(', ') : '';
+        const tooltip = s.label + ' (' + s.duration.toFixed(2) + 'ms)' + (metaStr ? '\n' + metaStr : '');
+
+        html += '<div class="ss-dbg-tl-row">'
+          + '<div class="ss-dbg-tl-label" style="padding-left:' + (8 + indent) + 'px" title="' + esc(tooltip) + '">'
+          + '<span class="ss-dbg-badge ss-dbg-badge-' + (s.category === 'db' ? 'purple' : s.category === 'mail' ? 'green' : s.category === 'event' ? 'amber' : s.category === 'view' ? 'blue' : 'muted') + '" style="font-size:9px;margin-right:4px">' + esc(catLabel) + '</span>'
+          + esc(s.label.length > 40 ? s.label.slice(0, 40) + '...' : s.label)
+          + '</div>'
+          + '<div class="ss-dbg-tl-track">'
+          + '<div class="ss-dbg-tl-bar ss-dbg-tl-bar-' + esc(s.category) + '" style="left:' + leftPct + '%;width:' + widthPct + '%" title="' + esc(tooltip) + '"></div>'
+          + '</div>'
+          + '<span class="ss-dbg-tl-dur">' + s.duration.toFixed(2) + 'ms</span>'
+          + '</div>';
+      }
+    }
+
+    // Warnings
+    if (trace.warnings && trace.warnings.length > 0) {
+      html += '<div class="ss-dbg-tl-warnings">'
+        + '<div class="ss-dbg-tl-warnings-title">Warnings (' + trace.warnings.length + ')</div>';
+      for (let w = 0; w < trace.warnings.length; w++) {
+        html += '<div class="ss-dbg-tl-warning">' + esc(trace.warnings[w]) + '</div>';
+      }
+      html += '</div>';
+    }
+
+    tlWaterfall.innerHTML = html;
+  };
+
+  if (tlBackBtn) {
+    tlBackBtn.addEventListener('click', () => {
+      if (tlListEl) tlListEl.style.display = '';
+      if (tlDetailEl) tlDetailEl.style.display = 'none';
+    });
+  }
+
+  if (tlSearchInput) tlSearchInput.addEventListener('input', renderTraces);
+
   // ── Custom panes: fetch, render, bind ───────────────────────────
   const getNestedValue = (obj, path) => {
     const parts = path.split('.');

package/dist/src/edge/client/stats-bar.css

@@ -6,7 +6,7 @@
   position: fixed;
   inset-inline: 0;
   bottom: 0;
-  z-index: 50;
+  z-index: 150;
   display: flex;
   height: 28px;
   align-items: center;
@@ -102,7 +102,7 @@
 .ss-toggle {
   position: fixed;
   right: 12px;
-  z-index: 50;
+  z-index: 150;
   display: flex;
   align-items: center;
   gap: 6px;
@@ -139,7 +139,7 @@
 /* Tooltip — positioned absolutely within .ss-bar (outside scroll area) via JS */
 .ss-tooltip {
   position: absolute;
-  z-index: 60;
+  z-index: 180;
   pointer-events: none;
 }
 .ss-tooltip.ss-pinned {

package/dist/src/edge/plugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../../src/edge/plugin.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAKrD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,iBAAiB,IACrD,MAAM,GAAG,UA+HlB"}
+{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../../src/edge/plugin.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAKrD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,iBAAiB,IACrD,MAAM,GAAG,UAgIlB"}

package/dist/src/edge/plugin.js

@@ -98,6 +98,7 @@ export function edgePluginServerStats(config) {
             state.debugJs = read("client/debug-panel.js");
             state.logsEndpoint = "/admin/api/debug/logs";
             state.customPanes = config.devToolbar?.panes || [];
+            state.showTracing = !!config.devToolbar?.tracing;
         }
         // Pre-render via Template directly — bypasses edge.createRenderer() which
         // would re-run #executePlugins and cause infinite recursion.

package/dist/src/edge/views/debug-panel.edge

@@ -1,6 +1,11 @@
-<div id="ss-dbg-panel" class="ss-dbg-panel" data-logs-endpoint="{{ logsEndpoint }}">
+<div id="ss-dbg-panel" class="ss-dbg-panel" data-logs-endpoint="{{ logsEndpoint }}" data-tracing="{{ showTracing ? '1' : '0' }}">
   <div class="ss-dbg-tabs">
-    <button type="button" class="ss-dbg-tab ss-dbg-active" data-ss-dbg-tab="queries">Queries</button>
+    @if(showTracing)
+      <button type="button" class="ss-dbg-tab ss-dbg-active" data-ss-dbg-tab="timeline">Timeline</button>
+      <button type="button" class="ss-dbg-tab" data-ss-dbg-tab="queries">Queries</button>
+    @else
+      <button type="button" class="ss-dbg-tab ss-dbg-active" data-ss-dbg-tab="queries">Queries</button>
+    @end
     <button type="button" class="ss-dbg-tab" data-ss-dbg-tab="events">Events</button>
     <button type="button" class="ss-dbg-tab" data-ss-dbg-tab="routes">Routes</button>
     <button type="button" class="ss-dbg-tab" data-ss-dbg-tab="logs">Logs</button>
@@ -14,7 +19,25 @@
     </div>
   </div>
   <div class="ss-dbg-content">
-    <div id="ss-dbg-pane-queries" class="ss-dbg-pane ss-dbg-active">
+    @if(showTracing)
+      <div id="ss-dbg-pane-timeline" class="ss-dbg-pane ss-dbg-active">
+        <div id="ss-dbg-timeline-list">
+          <div class="ss-dbg-search-bar">
+            <input type="text" class="ss-dbg-search" id="ss-dbg-search-timeline" placeholder="Filter by URL or method..." />
+            <span id="ss-dbg-timeline-summary" class="ss-dbg-summary"></span>
+          </div>
+          <div id="ss-dbg-timeline-body"><div class="ss-dbg-empty">Loading traces...</div></div>
+        </div>
+        <div id="ss-dbg-timeline-detail" style="display:none">
+          <div class="ss-dbg-tl-detail-header">
+            <button type="button" class="ss-dbg-btn-clear" id="ss-dbg-tl-back">&larr; Back</button>
+            <span id="ss-dbg-tl-detail-title" class="ss-dbg-summary"></span>
+          </div>
+          <div id="ss-dbg-tl-waterfall"></div>
+        </div>
+      </div>
+    @end
+    <div id="ss-dbg-pane-queries" class="ss-dbg-pane{{ showTracing ? '' : ' ss-dbg-active' }}">
       <div class="ss-dbg-search-bar">
         <input type="text" class="ss-dbg-search" id="ss-dbg-search-queries" placeholder="Filter queries by SQL, model, or method..." />
         <span id="ss-dbg-queries-summary" class="ss-dbg-summary"></span>

package/dist/src/index.d.ts

@@ -1,7 +1,8 @@
 export { defineConfig } from './define_config.js';
 export { StatsEngine } from './engine/stats_engine.js';
 export { RequestMetrics } from './engine/request_metrics.js';
+export { trace } from './debug/trace_collector.js';
 export type { MetricCollector } from './collectors/collector.js';
 export type { MetricValue, ServerStats, ServerStatsConfig, LogStats, DevToolbarOptions } from './types.js';
-export type { DebugPane, DebugPaneColumn, DebugPaneFormatType, DebugPaneSearch, BadgeColor, QueryRecord, EventRecord, EmailRecord, RouteRecord, DevToolbarConfig, } from './debug/types.js';
+export type { DebugPane, DebugPaneColumn, DebugPaneFormatType, DebugPaneSearch, BadgeColor, QueryRecord, EventRecord, EmailRecord, RouteRecord, TraceSpan, TraceRecord, DevToolbarConfig, } from './debug/types.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,YAAY,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAC1G,YAAY,EACV,SAAS,EACT,eAAe,EACf,mBAAmB,EACnB,eAAe,EACf,UAAU,EACV,WAAW,EACX,WAAW,EACX,WAAW,EACX,WAAW,EACX,gBAAgB,GACjB,MAAM,kBAAkB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAA;AAClD,YAAY,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAC1G,YAAY,EACV,SAAS,EACT,eAAe,EACf,mBAAmB,EACnB,eAAe,EACf,UAAU,EACV,WAAW,EACX,WAAW,EACX,WAAW,EACX,WAAW,EACX,SAAS,EACT,WAAW,EACX,gBAAgB,GACjB,MAAM,kBAAkB,CAAA"}

package/dist/src/index.js

@@ -1,3 +1,4 @@
 export { defineConfig } from './define_config.js';
 export { StatsEngine } from './engine/stats_engine.js';
 export { RequestMetrics } from './engine/request_metrics.js';
+export { trace } from './debug/trace_collector.js';

package/dist/src/middleware/request_tracking_middleware.d.ts

@@ -1,6 +1,8 @@
 import type { HttpContext } from "@adonisjs/core/http";
 import type { NextFn } from "@adonisjs/core/types/http";
+import type { TraceCollector } from "../debug/trace_collector.js";
 export declare function setShouldShow(fn: ((ctx: any) => boolean) | null): void;
+export declare function setTraceCollector(collector: TraceCollector | null): void;
 export default class RequestTrackingMiddleware {
     handle(ctx: HttpContext, next: NextFn): Promise<void>;
 }

package/dist/src/middleware/request_tracking_middleware.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"request_tracking_middleware.d.ts","sourceRoot":"","sources":["../../../src/middleware/request_tracking_middleware.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAOxD,wBAAgB,aAAa,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,IAAI,QAE/D;AAED,MAAM,CAAC,OAAO,OAAO,yBAAyB;IACtC,MAAM,CAAC,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM;CA8B5C"}
+{"version":3,"file":"request_tracking_middleware.d.ts","sourceRoot":"","sources":["../../../src/middleware/request_tracking_middleware.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAOlE,wBAAgB,aAAa,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,IAAI,QAE/D;AAOD,wBAAgB,iBAAiB,CAAC,SAAS,EAAE,cAAc,GAAG,IAAI,QAEjE;AAED,MAAM,CAAC,OAAO,OAAO,yBAAyB;IACtC,MAAM,CAAC,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM;CA4C5C"}

package/dist/src/middleware/request_tracking_middleware.js

@@ -7,6 +7,13 @@ let shouldShowFn = null;
 export function setShouldShow(fn) {
     shouldShowFn = fn;
 }
+/**
+ * Module-level trace collector, set by the provider when tracing is enabled.
+ */
+let traceCollector = null;
+export function setTraceCollector(collector) {
+    traceCollector = collector;
+}
 export default class RequestTrackingMiddleware {
     async handle(ctx, next) {
         const metrics = getRequestMetrics();
@@ -29,13 +36,22 @@ export default class RequestTrackingMiddleware {
                 },
             });
         }
-        try {
-            await next();
+        const runRequest = async () => {
+            try {
+                await next();
+            }
+            finally {
+                const duration = performance.now() - start;
+                metrics.decrementActiveConnections();
+                metrics.recordRequest(duration, ctx.response.getStatus());
+                traceCollector?.finishTrace(ctx.request.method(), ctx.request.url(true), ctx.response.getStatus());
+            }
+        };
+        if (traceCollector) {
+            await traceCollector.startTrace(runRequest);
         }
-        finally {
-            const duration = performance.now() - start;
-            metrics.decrementActiveConnections();
-            metrics.recordRequest(duration, ctx.response.getStatus());
+        else {
+            await runRequest();
         }
     }
 }

package/dist/src/provider/server_stats_provider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"server_stats_provider.d.ts","sourceRoot":"","sources":["../../../src/provider/server_stats_provider.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAI/D,MAAM,CAAC,OAAO,OAAO,mBAAmB;IAO1B,SAAS,CAAC,GAAG,EAAE,kBAAkB;IAN7C,OAAO,CAAC,UAAU,CAA+C;IACjE,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,UAAU,CAA2B;IAC7C,OAAO,CAAC,WAAW,CAAuB;IAC1C,OAAO,CAAC,UAAU,CAA+C;gBAE3C,GAAG,EAAE,kBAAkB;IAEvC,IAAI;IAoBJ,KAAK;YAoEG,eAAe;IA+CvB,QAAQ;CAuBf"}
+{"version":3,"file":"server_stats_provider.d.ts","sourceRoot":"","sources":["../../../src/provider/server_stats_provider.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAI/D,MAAM,CAAC,OAAO,OAAO,mBAAmB;IAO1B,SAAS,CAAC,GAAG,EAAE,kBAAkB;IAN7C,OAAO,CAAC,UAAU,CAA+C;IACjE,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,UAAU,CAA2B;IAC7C,OAAO,CAAC,WAAW,CAAuB;IAC1C,OAAO,CAAC,UAAU,CAA+C;gBAE3C,GAAG,EAAE,kBAAkB;IAEvC,IAAI;IAoBJ,KAAK;YAsEG,eAAe;IAoDvB,QAAQ;CAuBf"}

package/dist/src/provider/server_stats_provider.js

@@ -1,6 +1,6 @@
 import { StatsEngine } from "../engine/stats_engine.js";
 import { DebugStore } from "../debug/debug_store.js";
-import { setShouldShow } from "../middleware/request_tracking_middleware.js";
+import { setShouldShow, setTraceCollector } from "../middleware/request_tracking_middleware.js";
 export default class ServerStatsProvider {
     app;
     intervalId = null;
@@ -50,6 +50,8 @@ export default class ServerStatsProvider {
                 maxEmails: toolbarConfig.maxEmails ?? 100,
                 slowQueryThresholdMs: toolbarConfig.slowQueryThresholdMs ?? 100,
                 persistDebugData: toolbarConfig.persistDebugData ?? false,
+                tracing: toolbarConfig.tracing ?? false,
+                maxTraces: toolbarConfig.maxTraces ?? 200,
             });
         }
         let transmit = null;
@@ -113,6 +115,10 @@ export default class ServerStatsProvider {
             // Router not available
         }
         await this.debugStore.start(emitter, router);
+        // Wire trace collector into the request tracking middleware
+        if (this.debugStore.traces) {
+            setTraceCollector(this.debugStore.traces);
+        }
         // Periodic flush every 30 seconds (handles crashes)
         if (this.persistPath) {
             this.flushTimer = setInterval(async () => {

package/dist/src/types.d.ts

@@ -230,6 +230,21 @@ export interface DevToolbarOptions {
      * @default false
      */
     persistDebugData?: boolean | string;
+    /**
+     * Enable per-request tracing with timeline visualization.
+     *
+     * When enabled, each HTTP request is traced with a waterfall
+     * of all operations (DB queries, events, mail) that occurred
+     * during the request.
+     *
+     * @default false
+     */
+    tracing?: boolean;
+    /**
+     * Maximum number of request traces to keep in the ring buffer.
+     * @default 200
+     */
+    maxTraces?: number;
 }
 /**
  * Top-level configuration for `adonisjs-server-stats`.

package/dist/src/types.d.ts.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "adonisjs-server-stats",
-  "version": "1.1.4",
+  "version": "1.2.2",
   "description": "Real-time server monitoring for AdonisJS v6 applications",
   "type": "module",
   "main": "./dist/src/index.js",