ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-01 19:42:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(player): stop the shader loader sheen when the loader is hidden

Browse Source 
The loader hides with visibility/opacity so it can transition out, and
visibility: hidden does not stop an animation on a descendant. The sheen
kept ticking for the life of the page.

Measured in an idle Studio with a project open: 60.2 style recalculations
per second before, 2.0 after. The animation is inside the player's shadow
root, which is why document.getAnimations() never reported it and why
every probe that looked for animation frames, observers, intervals or
style writes came back empty.
This commit is contained in:
Miguel Angel Simon Sierra
2026-08-03 21:55:30 -07:00
parent 677fd31e9a
commit 4b8b5ffa76
1 changed files with 12 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/player/src/styles.ts
+12
View File
@@ -124,6 +124,18 @@ export const PLAYER_STYLES = /* css */ `
animation: hfp-shader-loader-sheen 1.9s linear infinite;
}
/*
* The loader hides with visibility/opacity so it can transition out, and
* visibility: hidden does NOT stop an animation on a descendant. Without
* this the sheen keeps ticking for the life of the page: measured at 60
* style recalculations per second in an otherwise idle Studio, for a
* shimmer nobody can see.
*/
.hfp-shader-loader:not(.hfp-visible):not(.hfp-hiding)
.hfp-shader-loader-title-text {
animation-play-state: paused;
}
.hfp-shader-loader-detail {
width: 100%;
height: 26px;