播放控制:为什么动画可以回退

播放器看起来要维护很多状态,其实只持有两样东西:一个游标 currentTime 与一个播放速率 speed。因为「时间 → 值」是一条纯函数管线 (时序 → 缓动塑形 → 采样),所以暂停只是停止累加、跳转 (seek) 只是直接改游标再重采样、重播只是把游标归零、 反向 (reverse) 只是给 speed 取负。没有任何一步需要「反着把动画再算一遍」——这就是动画天然可回退、可任意 scrub 的根本原因。

end

播放头 seek

state idle currentTime 0ms progress 0.00 value 0.00 speed 1

拖动播放头:这是在直接给游标赋值、再让纯函数重新算出该时刻的值,与动画是否在播放无关—— 所以能任意来回 scrub。点反向:只是把 speed 取负,下一帧起游标递减,动画立刻倒着走。把 repeatType 切到 reverse / mirror,观察往返时方向翻转发生在缓动之前还是之后的差别。

@vega/anim — 游标 + speed 即全部播放控制

这套可回退性,正是滚动驱动动画能把播放头绑到滚动条上 scrub 的前提; 驱动游标流动的唯一来源是 requestAnimationFrame,把它换成手动驱动器,动画就完全可被确定性测试。