artist page: compositor scroll pipeline + final hero design (crossfade twins, mirror seam, bloom retired)

Scroll-driven animation conversion
- apply() writes nothing per frame on the supported path; the hero
  squeeze, fade line and header curves all ride scroll-driven animations
  on the compositor.
- Section boundaries flip via IntersectionObserver sentinels; the scroll
  listener is gone from the hot path.
- The scrollbar thumb rides its own scroll-driven animation.
- @supports-not fallback keeps the previous rAF --p path verbatim, so
  unsupported engines render identically.
- Curves verified exact to 1e-6 against the old path, 0.000px continuity
  across boundary flips, correct retarget on resize.

Perf fixes
- Forced-layout reads pulled out of both scroll handlers.
- Resize settle-reflow: a second reflow 200ms after resize quiesces, and
  the pane is observed too. This was the root cause of the fullscreen
  fade-wedge and of the long-standing intermittent where rows stayed
  hidden after a resize.

Glass
- backdrop-filter removed from chips and preview surfaces.
- Bar glass blur 20 -> 12.
- Choose-hero pill removed from the UI; pickArtistHero/clearArtistHero
  backend is untouched and the control can be re-homed later.

Hero design (final)
- Crossfade twins are permanent. Twin blur is baked via bakeBlur()
  (clamp-to-edge pad -> blur -> crop) so the frames stay pixel-aligned
  with no edge fringe and no geometry scaling.
- Bloom strip retired everywhere; HeroGpuCanvas's internal bloom canvases
  are hidden by one scoped rule and the component is unchanged.
- Seam is a pure mirror: the artwork's top strip flipped inside the glass
  band, clipped at the bar's top line, riding the squeeze with the hero
  and dissolving in lockstep on rotation.
- GPU twin overlay crossfades on rotation instead of snapping — the
  incoming baked frame fades in on hero-banner-in with a 2-frame cap.
- ~930 lines of experimental variants and the perf-flag system deleted;
  the surviving path is a pixel no-op against the approved configuration.

Debug overlay
- PERF/SEAM rows dropped; the overlay keeps stats plus an FPS/drops/worst
  counter (Ctrl+Shift+D).
This commit is contained in:
KeelrLeek committed 2026-07-24 17:02:21 -05:00
1 parent 790a9c60c0
commit 2eb1cf57e3
4 files changed
+1453 -260

No files matched your search

+15
View File
@@ -130,6 +130,21 @@
opacity: 1;
pointer-events: auto;
}
/* The thumb's slide as a scroll-driven animation (scrollbar.js sets it up
where animation-timeline is supported). Endpoints are written by measure():
--ft-y0 = topInset - padTop, --ft-y1 = --ft-y0 + (trackH - thumbH). The
default animation range spans the scroller's whole scroll range, so linear
progress IS scrollTop / maxScroll — the exact ratio the JS fallback
computes — and the compositor tracks the scroll with zero main-thread
work (and none of the fallback's one-frame lag under threaded scrolling). */
@keyframes float-thumb-ride {
from {
transform: translateY(var(--ft-y0, 0px));
}
to {
transform: translateY(var(--ft-y1, 0px));
}
}
* {
margin: 0;