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 they can talk over it in a screen recording, WITHOUT the extra time slowing outro animations into slow-mo, and with the existing playback-speed setting still applying to the body but never stretching the hold.

Three pieces made this clean:

Model playback as a two-act piecewise timeline, not a scalar rate. {pre_outro_s, outro_s} with two pure functions: elapsed_to_progress(elapsed, tl, speed) (pre-outro consumed at speedx, outro at 1x wall-clock) and its exact inverse progress_to_elapsed. Rewrite rAF loops to be elapsed-based (progress = f(play_start_elapsed + now - play_start_time)) instead of incrementing progress by dt * rate. Every discontinuity (seek, pause/resume, speed change, outro-tier change) is then just play_start_time = now; play_start_elapsed = progress_to_elapsed(progress, tl, speed). The inverse function is what keeps seek/speed-change recalibration exact; test it as a round-trip property.
Make phase mappers duration-aware instead of re-deriving fractions everywhere. Convert hardcoded phase-boundary fractions to absolute seconds once, export PRE_OUTRO_S / BASE_OUTRO_S constants, and give the mapper an outro_extra_s = 0 parameter that recomputes boundary fractions as abs_seconds / (base_total + extra). At extra=0 output is bit-identical (safe default for all untouched callers); with extra, only the outro band widens.
The slow-mo trap: outro phase_t now spans the extended hold. Any drawing driven by phase_t (0..1 across the outro) stretches: pulses slow down, camera sways crawl, confetti falls in slow motion. Fix with a native-pace clock: at the top of outro drawing, rescale t = phase_t * (BASE_OUTRO_S + extra) / BASE_OUTRO_S and leave it UNCLAMPED. Then audit each term: one-shot entrances (eased slides, fade-ins) must self-clamp (min(t, 1), or verify your smoothstep clamps internally — beware ease_out_back-style overshoot easings extrapolating garbage past t=1; clamp their input); periodic terms (sin pulses, orbits, bobs) use unclamped t so cadence stays native through the hold; physical one-shots (falling particles) also use unclamped t — they just finish and rest, which reads correctly as a calm hold.

Offline/export audio needs the same split: schedule cues at absolute seconds anchored to the BASE duration (fraction_of_standard_timeline * BASE_DURATION_S), never at fractions of the extended render duration, so a longer export only appends trailing silence instead of sliding every cue later.

Verification that caught real drift: (a) unit-test the mapper boundaries at extra=0 against pre-change values; (b) live, play at 2x with +30s and confirm the seek label advances ~2 timeline-seconds/wall-second in the body and exactly 1:1 in the outro; (c) for exports, decode the rendered file's audio track in-browser (AudioContext.decodeAudioData on the blob) and assert a per-second RMS profile — cue positions unchanged, hold silent. The RMS-profile trick turns 'does the export sound right' into a scriptable assertion.