perf(webapp): stop shipping raw span events in the run trace loader payload

The trace tree only renders the derived timelineEvents, so the raw span
events (with full properties) were serialized into the loader response
as dead weight on event-heavy traces. Raw events now stay server-side,
and timeline events no longer carry the raw event properties (the field
was never in the TimelineSpanEvent type and nothing rendered it).

Author: ericallam

.server-changes/trace-page-payload-diet.md

@@ -0,0 +1,6 @@
+---
+area: webapp
+type: improvement
+---
+
+Shrinks the run trace page loader payload by keeping raw span events server-side and makes large trace trees render more efficiently. Also adds an optional `TRACE_VIEW_EMERGENCY_SPAN_CAP` env var that clamps trace summary span limits on both event store paths.

apps/webapp/app/presenters/v3/RunPresenter.server.ts

@@ -255,12 +255,16 @@ export class RunPresenter {
             linkedRunIdBySpanId[n.id] = n.runId;
           }
 
+          // Raw span events are only needed server-side (to derive timelineEvents);
+          // keep them out of the serialized loader payload.
+          const { events: spanEvents, ...data } = n.data;
+
           return {
             ...n,
             data: {
-              ...n.data,
+              ...data,
               timelineEvents: createTimelineSpanEventsFromSpanEvents(
-                n.data.events,
+                spanEvents,
                 user?.admin ?? false,
                 treeRootStartTimeMs
               ),

apps/webapp/app/utils/timelineSpanEvents.ts

@@ -117,7 +117,6 @@ export function createTimelineSpanEventsFromSpanEvents(
       offset,
       timestamp,
       duration,
-      properties: spanEvent.properties,
       helpText: getHelpTextForEvent(name),
       markerVariant,
       lineVariant: "light" as const,

apps/webapp/app/v3/mollifier/syntheticTrace.server.ts

@@ -44,11 +44,14 @@ export function buildSyntheticTraceForBufferedRun(run: SyntheticRun) {
         const offset = millisecondsToNanoseconds(
           n.data.startTime.getTime() - treeRootStartTimeMs
         );
+        // Mirror RunPresenter: raw span events stay server-side, only
+        // timelineEvents ship to the client.
+        const { events: spanEvents, ...data } = n.data;
         return {
           ...n,
           data: {
-            ...n.data,
-            timelineEvents: createTimelineSpanEventsFromSpanEvents(n.data.events, false, treeRootStartTimeMs),
+            ...data,
+            timelineEvents: createTimelineSpanEventsFromSpanEvents(spanEvents, false, treeRootStartTimeMs),
             duration: n.data.isPartial ? null : n.data.duration,
             offset,
             isRoot: n.id === spanId,

apps/webapp/test/mollifierSyntheticTrace.test.ts

@@ -141,9 +141,10 @@ describe("buildSyntheticTraceForBufferedRun", () => {
     expect(trace.queuedDuration).toBeUndefined();
   });
 
-  it("synthesises an empty events list (no timeline events from the buffer)", () => {
+  it("synthesises an empty timeline and keeps raw span events out of the payload", () => {
     const trace = buildSyntheticTraceForBufferedRun(makeSyntheticRun());
-    expect(trace.events[0].data.events).toEqual([]);
+    // Raw span events stay server-side (mirrors RunPresenter's payload diet).
+    expect(trace.events[0].data).not.toHaveProperty("events");
     expect(trace.events[0].data.timelineEvents).toEqual([]);
   });
 });

apps/webapp/test/timelineSpanEvents.test.ts

@@ -181,6 +181,15 @@ describe("createTimelineSpanEventsFromSpanEvents", () => {
     );
   });
 
+  test("should not attach raw span event properties to timeline events", () => {
+    const result = createTimelineSpanEventsFromSpanEvents(sampleSpanEvents, true);
+
+    expect(result.length).toBeGreaterThan(0);
+    for (const event of result) {
+      expect(event).not.toHaveProperty("properties");
+    }
+  });
+
   test("should preserve duration from span events", () => {
     const result = createTimelineSpanEventsFromSpanEvents(sampleSpanEvents, true);