SuperAPI AI 工具集

vercel-react-native-skills

前端与建站

查看项目

更新于 10-16 09:31

技能介绍

用途:为 React Native 和 Expo 应用开发提供成体系的最佳实践规则,覆盖性能、动画、UI 模式与平台特定优化,适合在构建组件、优化列表、实现动画或处理原生模块时参考。

主要能力:按优先级分为八类规则。列表性能为最高优先级,包含使用 FlashList 虚拟化大列表、记忆化列表项、稳定回调引用、避免内联样式对象、把函数移出渲染、优化列表图片、将耗时工作移出列表项、用 item types 处理异构列表。动画类要求只动画 transform 与 opacity,使用 useDerivedValue 处理计算动画,用 Gesture.Tap 替代 Pressable。导航类建议用原生 stack 与原生 tabs 替代 JS 导航器。UI 模式类包含用 expo-image 处理图片、用 Galeria 做图片灯箱、用 Pressable 替代 TouchableOpacity、处理 ScrollView 安全区、用 contentInset 处理头部、使用原生上下文菜单与原生模态、用 onLayout 而非 measure()、用 StyleSheet.create 或 Nativewind 管理样式。状态管理类涉及最小化状态订阅、dispatcher 模式、首渲染 fallback,以及配合 React Compiler 的解构与共享值处理。渲染类要求文本包在 Text 组件内、避免用 falsy && 做条件渲染。Monorepo 类要求原生依赖留在 app 包内并在各包间使用统一版本。配置类涉及用 config plugin 处理自定义字体、组织设计系统导入、提升 Intl 对象创建。

使用方式:按规则文件逐一查阅,例如 rules/list-performance-virtualize.md、rules/animation-gpu-properties.md,每个文件包含原因说明、错误代码示例、正确代码示例与补充参考;完整展开版见 AGENTS.md。资料未提供安装命令或具体集成步骤。

适用场景:React Native / Expo 应用开发、列表与滚动性能优化、Reanimated 动画、图片与媒体处理、原生模块或字体配置、含原生依赖的 monorepo 项目结构。

限制:资料仅给出规则清单与文件组织方式,未说明适用版本、平台差异、收费情况或实际效果数据,这些暂未提供。