~/transitions/animator.js
1// 用 Web Animations API 驱动可中断的 GPU 过渡
2export function animate(el, keyframes, opts) {
3 const a = el.animate(keyframes, {
4 duration: opts.duration ?? 800,
5 easing: "cubic-bezier(.7,.05,.2,1)",
6 fill: "both",
7 });
8 return new Promise(r => (a.onfinish = r));
9}
10
11// 7 种过渡,全部走 transform / clip-path · 60 fps