[Desktop] Text shimmer repaints every frame; propose an opacity pulse (design review) #48708

Activity

1. github-actions

   assigned

   Hona

   on Sep 12, 2026
2. skywalkerwhack commented on Oct 10, 2026

   

   skywalkerwhack

   on Oct 10, 2026

   More actions

   Confirmed on the v2 web client too — not just Desktop — and it scales with the display refresh rate.

   Same animation in the web client. In the v2 web UI (opencode serve, v2.0.24, Chrome) the "N running" badge carries the same text-shimmer-sweep animation: 1200ms, iteration-count: infinite, animating background-position on an element with a two-layer linear-gradient(...) + background-clip: text and will-change: background-position. Exactly the per-frame text repaint described above.

   In-page measurement (v2 web client, CDP Performance.getMetrics, ~60 Hz headless Chromium, session with the running badge visible):

   variant	renderer main-thread TaskDuration
   text-shimmer-sweep running	0.915 s / 6 s (~15%, dominated by non-script paint/composite)
   same page, that one animation pause()d	0.007 s / 6 s (~0.1%)

   So the single shimmer accounts for essentially all of the renderer work on that view. (This is the idle "N running" case; streaming re-render is a different mechanism — see #49552.)

   Display refresh rate amplifies it. On a 144 Hz Windows laptop the same animation repaints at 144 fps. In a DevTools trace from that machine the GPU-process vsync thread ticks at exactly ~144/s (6.94 ms start-to-start interval) for the whole 15.6 s capture, and chrome://gpu reports Refresh Rate in Hz: 144 (HW acceleration on, Intel UHD via ANGLE/D3D11). At 144 Hz the cost is ~2.4× the 60 Hz figure, which is why the reporter sees CPU "spike the moment a session with a running indicator is opened".

   Workaround that already works today: the animation respects prefers-reduced-motion. With DevTools emulateMedia({ reducedMotion: 'reduce' }), document.getAnimations() is empty on that view while the "N running" text stays visible. So OS "reduce motion" (Windows: Settings → Accessibility → Visual effects → Animation effects → off) silences the per-frame repaint without losing the indicator.

   Ask: the sweep → opacity-pulse approach in #48709 is the right direction — please make sure it also covers the v2 web client (shared text-shimmer), not only Desktop.