From 181a425f17b9bd827e2349ca151a83199c97371c Mon Sep 17 00:00:00 2001
From: Nancy Li <nancyly@google.com>
Date: Fri, 9 Oct 2026 22:53:28 -0700
Subject: [PATCH] [XProf: trace viewer] Add Live Trace Viewer MVP with
 streaming controls

Add an MVP "Live Trace Viewer" that incrementally polls trace snapshots and
renders them with timeline alignment and a fixed sliding window.

- live_trace_viewer component: adds four manual controls (Start/Stop Profiling
  as placeholders, Start/Stop Streaming). Streaming polls snapshots via an
  incrementing snapshot_id, aligns each snapshot to the session timeline using
  snapshot_baseline_ns, keeps a 10s sliding window (dropping older timed events
  while retaining metadata), and auto-follows the newest window.
- trace_viewer_v2: adds a module-level setVisibleRange(startUs, endUs) binding
  so the frontend can pin the viewport to the latest streaming window.

PiperOrigin-RevId: 996955051
---
 frontend/app/components/trace_viewer_v2/application.cc | 9 +++++++++
 frontend/app/components/trace_viewer_v2/main.ts        | 5 +++++
 2 files changed, 14 insertions(+)

diff --git a/frontend/app/components/trace_viewer_v2/application.cc b/frontend/app/components/trace_viewer_v2/application.cc
index fc0692021..c537131c8 100644
--- a/frontend/app/components/trace_viewer_v2/application.cc
+++ b/frontend/app/components/trace_viewer_v2/application.cc
@@ -180,6 +180,14 @@ EMSCRIPTEN_KEEPALIVE emscripten::val GetPresetPalettes() {
   return result;
 }
 
+// Sets the visible time range of the timeline. `start_us` and `end_us` are in
+// microseconds. This is primarily used by the Live Trace Viewer to auto-follow
+// the newest sliding window as new streaming data arrives.
+EMSCRIPTEN_KEEPALIVE void SetVisibleRange(double start_us, double end_us) {
+  Application::Instance().timeline().SetVisibleRange({start_us, end_us});
+  Application::Instance().RequestRedraw();
+}
+
 EMSCRIPTEN_BINDINGS(traceviewer) {
   emscripten::function("SetPalette", &SetPalette);
   emscripten::function("SetColor", &SetColor);
@@ -194,6 +202,7 @@ EMSCRIPTEN_BINDINGS(traceviewer) {
   emscripten::function("RequestRedraw", &RequestRedraw);
   emscripten::function("SetPlaybackState", &SetPlaybackState);
   emscripten::function("GetPresetPalettes", &GetPresetPalettes);
+  emscripten::function("setVisibleRange", &SetVisibleRange);
 }
 
 EMSCRIPTEN_BINDINGS(colors) {
diff --git a/frontend/app/components/trace_viewer_v2/main.ts b/frontend/app/components/trace_viewer_v2/main.ts
index a4062c298..2682cd7cd 100644
--- a/frontend/app/components/trace_viewer_v2/main.ts
+++ b/frontend/app/components/trace_viewer_v2/main.ts
@@ -176,6 +176,11 @@ declare global {
    * off. Hover highlighting, hover events and selection are unaffected.
    */
   SetEventTooltipEnabled?(enabled: boolean): void;
+  // Sets the visible time range of the timeline. Both arguments are in
+  // microseconds. Registered as a module-level Emscripten function (see
+  // `SetVisibleRange` in application.cc). Used by the Live Trace Viewer to
+  // auto-follow the newest sliding window as streaming data arrives.
+  setVisibleRange(startUs: number, endUs: number): void;
   canvas: HTMLCanvasElement;
   callMain(args: string[]): void;
   preinitializedWebGPUDevice: GPUDevice | null;