vercel-react-native-skills 是一套面向 React Native 与 Expo 应用开发的最佳实践规则集合，来源于 vercel-labs/openreview。它的用途是帮助开发者在构建移动应用时遵循经过整理的实践建议，尤其聚焦于性能、动画、UI 模式与平台相关优化。
适用时机 当你在构建 React Native 或 Expo 应用、优化列表与滚动性能、使用 Reanimated 实现动画、处理图片与媒体、配置原生模块或字体，或组织包含原生依赖的 Monorepo 项目时，可以参照这些规则。
规则分类与优先级 规则按优先级和影响程度分为多个类别，并通过前缀标识：
- 列表性能（CRITICAL，前缀 list-performance-）
- 动画（HIGH，前缀 animation-）
- 导航（HIGH，前缀 navigation-）
- UI 模式（HIGH，前缀 ui-）
- 状态管理（MEDIUM，前缀 react-state-、react-compiler-）
- 渲染（MEDIUM，前缀 rendering-）
- Monorepo（MEDIUM，前缀 monorepo-）
- 配置（LOW，前缀 fonts-、imports-、js-）
主要规则速览
- 列表性能（CRITICAL）：使用 FlashList 处理大列表；对列表项组件做记忆化；稳定回调引用；避免内联样式对象；将函数提取到渲染之外；优化列表中的图片；把昂贵工作移出列表项；对异构列表使用 item types。
- 动画（HIGH）：只对 transform 和 opacity 做动画；使用 useDerivedValue 处理计算型动画；使用 Gesture.Tap 代替 Pressable。
- 导航（HIGH）：优先使用原生 stack 与原生 tabs，而非 JS 导航器。
- UI 模式（HIGH）：所有图片使用 expo-image；使用 Galeria 做图片灯箱；使用 Pressable 代替 TouchableOpacity；在 ScrollViews 中处理安全区域；使用 contentInset 处理头部；使用原生上下文菜单；尽可能使用原生模态；使用 onLayout 而非 measure()；使用 StyleSheet.create 或 Nativewind。
- 状态管理（MEDIUM）：最小化状态订阅；使用 dispatcher 模式处理回调；首次渲染显示 fallback；为 React Compiler 解构函数；处理编译器下的 Reanimated shared values。
- 渲染（MEDIUM）：将文本包裹在 Text 组件中；避免用 falsy && 做条件渲染。
- Monorepo（MEDIUM）：将原生依赖保留在 app 包内；跨包使用单一版本。
- 配置（LOW）：使用 config plugins 配置自定义字体；组织设计系统导入；提升 Intl 对象创建。
使用方式 每条规则以独立的 Markdown 文件存在，例如 rules/list-performance-virtualize.md、rules/animation-gpu-properties.md。每个规则文件包含：该规则为何重要的简要说明、带解释的错误代码示例、带解释的正确代码示例，以及补充上下文与参考。若要查看所有规则展开后的完整指南，可查看 AGENTS.md。
限制与暂未提供的信息 资料中未提供该技能的安装命令、价格、收费方式、授权许可、平台要求或具体效果数据，这些内容暂未提供。