awesome-react-animations - 构建流畅且由合成器驱动的 React 动画
指导 React 和 Next.js 动画的实现、审查与修复,以保持流畅性能、合成器友好动效并支持减少动态效果。
标签
更新于: 2026-09-28该技能可以做什么
- 将逐帧值移出 React 状态
- 使用 transform 和 opacity 动画
- 使用 Framer Motion 原语
- 配置减少动态效果行为
- 选择 CSS 或 Framer Motion
- 优化动画代码包
- 验证实际渲染结果
输入
- React 或 Next.js 代码库
- 动画需求
- 目标交互行为
- 性能约束
- 无障碍要求
输出
- 动画实现指导
- React 或 CSS 动画代码
- 动画审查结果
- 减少动态效果行为
要求
- React 或 Next.js 应用
- 支持 CSS 动画的浏览器
- 使用相关原语时需要 Framer Motion
