用途：该技能面向使用 Anime.js 构建高保真网页动画的场景，适合复杂多阶段落地页编排、网格/文字/数据可视化的交错揭示、SVG 路径动画（形状变形、动态线条绘制）以及响应输入的动态交互 UI。
主要能力：通过 anime.timeline() 编排复杂动画序列，掌握相对偏移（如 '-=200'）与绝对偏移实现无缝重叠运动；使用 anime.stagger() 为多元素添加有机节奏；支持自定义 cubicBezier、spring、elastic 等高级缓动函数，而非基础线性或 ease-in-out。
使用方式：先确定要动画的 DOM 元素或 SVG；定义动画属性与缓动；用时间线编排；再实现。示例代码：const tl = anime.timeline({ easing: "spring(1, 80, 10, 0)", duration: 1000 }); tl.add({ targets: ".hero-text", translateY: [50, 0], opacity: [0, 1], delay: anime.stagger(100) }).add({ targets: ".hero-image", scale: [0.9, 1], opacity: [0, 1] }, "-=800");
适用场景：奖项级交互网站、需要定制流畅动画的现代 UI/UX。
限制：仅在任务明确匹配上述范围时使用；输出不能替代针对具体环境的验证、测试或专家评审；若缺少必要输入、权限、安全边界或成功标准，应停止并请求澄清。性能上需监控主线程占用，适当使用 will-change: transform, opacity 以启用 GPU 加速。该技能为上游仓库的打包层，需保持来源可追溯，只加载对结果有实质影响的文件。