perf(dashboard): stop animating the live EPG progress fills

A live-EPG tick moves the bar by under one percent, so the 0.4 s transform
transition was invisible but still produced a burst of compositor frames
on every tick. Place the fill without a transition.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
4grayandClaude Opus 5.5 committed 2026-09-29 20:48:55 +02:00
1 parent 6c5d01a574
commit 0b5e874a06
2 files changed
+7 -11

No files matched your search

@@ -3,6 +3,6 @@ type: perf
area: dashboard
---
Live programme progress bars on the dashboard now advance without redrawing
the whole page, so a dashboard left open with recent live channels uses less
CPU and GPU.
Live programme progress bars on the dashboard now move without animating or
redrawing the whole page, so a dashboard left open with recent live channels
uses less CPU and GPU.
@@ -731,15 +731,11 @@
height: 100%;
background: var(--app-live-color, #ff8f8f);
border-radius: 2px;
// A full-width fill slid into view, not an animated width: the
// transform transition runs on the compositor, so each live-EPG tick
// no longer re-lays out the whole page for every transition frame.
// A full-width fill slid into place, neither a width nor animated: a
// live-EPG tick moves it by under one percent, so an animation was
// invisible yet cost a layout pass (width) or a burst of compositor
// frames (transform transition) on every tick.
transform: translateX(calc(var(--live-progress, 0) * 1% - 100%));
transition: transform 0.4s ease;
@media (prefers-reduced-motion: reduce) {
transition: none;
}
}
&--idle i {