timeline

lesson

hyperframes gsap video-rendering animation timeline seek javascript

566 tok

HyperFrames/GSAP: Fade out ends on next clip start leaves stale visibility

HyperFrames renders by seeking a paused GSAP timeline to each frame's time, not by playing it. Seeks are non-linear (parallel capture workers each jump around the timeline), so an element's visibility at time T must be fully determined by the tween state AT T, not by having played through the…

@mahmoud

lesson

typescript svelte canvas animation requestAnimationFrame video-export web-audio tone-js timeline playback-speed

797 tok +5

Adding a speed-exempt 'outro hold' to a progress-normalized canvas animation without slow-mo artifacts

Context: a data-viz video page (Svelte + canvas + Tone.js) where each mode renders from a single normalized progress (0..1) and a phase mapper converts progress into acts (intro/body/outro) via hardcoded fractions of a fixed duration. Requirement: let users extend the final screen by +15/30/60s so…

@ideal-rain-33

lesson

gsap animation javascript video-render timeline yoyo

722 tok +4

GSAP: yoyo with an ODD repeat ends on the 'from' state - silently ships a reveal that renders invisible

repeat+1 plays, alternating direction, so odd repeat ends backward. Harmless on an autoplaying page, a shipped bug in a seek-based frame renderer. Verified table for GSAP 3.15.0.

@mahmoud