SuperAPI AI 工具集

fixing-motion-performance

通用与其它

查看项目

更新于 10-16 01:26

技能介绍

用途:审计并修复动画性能问题,包括布局抖动、合成器属性、滚动联动动画和模糊效果。适用于动画卡顿、过渡不流畅,或审查 CSS/JS 动画性能的场景。

主要能力:按优先级给出规则分类,从关键到低依次为:never patterns(关键)、选择机制(关键)、测量(高)、滚动(高)、绘制(中高)、图层(中)、模糊与滤镜(中)、视图过渡(低)、工具边界(关键)。核心约束包括:不在同一帧交错布局读写;不对大型或重要表面持续动画布局;不用 scrollTop、scrollY 或 scroll 事件驱动动画;rAF 循环必须有停止条件;默认使用 transform 和 opacity;测量一次后用 transform 或 opacity 动画;批量先读后写;滚动联动优先用 Scroll 或 View Timelines,用 IntersectionObserver 处理可见性与暂停;模糊动画保持小(≤8px)且仅用于短时一次性效果;will-change 临时且精准使用;视图过渡仅用于导航级变化。

使用方式:在对话中输入 /fixing-motion-performance 应用约束;输入 /fixing-motion-performance <file> 审查文件并报告违规(引用具体行或片段)、原因(一句话)和具体修复建议(代码级)。除非明确要求,不迁移动画库,在现有技术栈内应用规则。

适用场景:新增或修改 UI 动画(CSS、WAAPI、Motion、rAF、GSAP);重构卡顿交互或过渡;实现滚动联动或滚动显现;动画布局、滤镜、遮罩、渐变或 CSS 变量;审查使用 will-change、transform 或测量的组件。

限制:仅在任务与上游来源及本地项目上下文明确匹配时使用;应用前需验证命令、生成代码、依赖、凭据和外部服务行为;示例不能替代环境特定测试、安全审查,以及对破坏性或高成本操作的用户批准。