React Native 技能包 是做什么的？
React Native 和 Expo 应用的全面最佳实践。包含多个类别的规则，涵盖性能、动画、UI 模式和平台特定优化。
何时使用
在以下情况下参考这些指南：
- 构建 React Native 或 Expo 应用
- 优化列表和滚动性能
- 使用 Reanimated 实现动画
- 处理图片和媒体
- 配置原生模块或字体
- 组织包含原生依赖的 Monorepo 项目
按优先级分类的规则
| 优先级 | 类别 | 影响 | 前缀 |
|---|---|---|---|
| 1 | 列表性能 | 严重 | list-performance- |
| 2 | 动画 | 高 | animation- |
| 3 | 导航 | 高 | navigation- |
| 4 | UI 模式 | 高 | ui- |
| 5 | 状态管理 | 中 | react-state- |
| 6 | 渲染 | 中 | rendering- |
| 7 | Monorepo | 中 | monorepo- |
| 8 | 配置 | 低 | fonts-, imports- |
快速参考
1. 列表性能（严重）
list-performance-virtualize- 对于大型列表使用 FlashListlist-performance-item-memo- 对列表项组件使用 memolist-performance-callbacks- 稳定回调引用list-performance-inline-objects- 避免内联样式对象list-performance-function-references- 将函数提取到 render 外部list-performance-images- 优化列表中的图片list-performance-item-expensive- 将耗时操作移到列表项外部list-performance-item-types- 对异构列表使用 item 类型
2. 动画（高）
animation-gpu-properties- 仅对 transform 和 opacity 做动画animation-derived-value- 使用 useDerivedValue 进行计算的动画animation-gesture-detector-press- 使用 Gesture.Tap 代替 Pressable
3. 导航（高）
navigation-native-navigators- 使用原生 Stack 和原生 Tabs 代替 JS 导航器
4. UI 模式（高）
ui-expo-image- 对所有图片使用 expo-imageui-image-gallery- 使用 Galeria 实现图片灯箱ui-pressable- 使用 Pressable 代替 TouchableOpacityui-safe-area-scroll- 在 ScrollView 中处理安全区域ui-scrollview-content-inset- 对头部使用 contentInsetui-menus- 使用原生上下文菜单ui-native-modals- 尽可能使用原生模态框ui-measure-views- 使用 onLayout，而不是 measure()ui-styling- 使用 StyleSheet.create 或 Nativewind
5. 状态管理（中）
react-state-minimize- 最小化状态订阅react-state-dispatcher- 对回调使用 dispatcher 模式react-state-fallback- 在首次渲染时显示 fallbackreact-compiler-destructure-functions- 为 React Compiler 解构函数react-compiler-reanimated-shared-values- 处理与编译器共用的 shared values
6. 渲染（中）
rendering-text-in-text-component- 将文本包裹在 Text 组件中rendering-no-falsy-and- 避免使用 falsy && 进行条件渲染
7. Monorepo（中）
monorepo-native-deps-in-app- 将原生依赖保留在应用包中monorepo-single-dependency-versions- 在所有包中使用单一版本
8. 配置（低）
fonts-config-plugin- 使用配置插件处理自定义字体imports-design-system-folder- 组织设计系统导入js-hoist-intl- 提升 Intl 对象的创建
使用方法
阅读单个规则文件以获取详细说明和代码示例：
rules/list-performance-virtualize.md
rules/animation-gpu-properties.md
每个规则文件包含：
- 为何重要的简要说明
- 错误代码示例及解释
- 正确代码示例及解释
- 额外的上下文和参考
完整文档
如需所有规则展开的完整指南，请参阅：AGENTS.md