React Native

是什么

React Native 是 Meta 开发的开源框架，用于使用 React 和 JavaScript（或 TypeScript）构建原生移动应用。你像为 Web 编写组件那样编写组件，但它们渲染为真正的原生 iOS 和 Android UI 控件，而非 web view。大部分代码可在两个平台间共享，同时在需要时你仍可下沉到平台特定的原生代码。

优势

• 一套代码库，两个平台——在 iOS 和 Android 之间共享大部分逻辑和 UI。
• 使用 React，因此 Web 开发者能很快上手，且生态系统庞大。
• 渲染真正的原生组件，而非 web view，带来真正原生的体验。
• Fast Refresh 在编辑时提供近乎即时的反馈。
• 逃生通道：遇到瓶颈时，可用 Swift/Kotlin 编写原生模块。

取舍

• JavaScript 与原生之间的桥接，可能会使性能关键或动画密集的工作变得复杂。
• 原生依赖和构建工具链可能较为脆弱，且对版本敏感。
• 在棘手的部分，你仍然需要平台知识（构建 iOS 还需要一台 Mac）。
• 一些较新的操作系统特性会有滞后，要等社区或你自己去封装。

何时使用

当你希望用一个团队、一套代码库在 iOS 和 Android 上交付原生应用时，尤其是当团队已经熟悉 React 时，可以选择 React Native。它非常适合内容类、电商类和 CRUD 类应用。

与 vibe coding 的契合度

React Native 对 AI 辅助编码很友好，因为它本质就是 React——助手对组件、hooks 和 props 极为精通。让模型使用 TypeScript，尽可能保持组件小巧且无状态，并将其与 Expo 搭配，以获得轻松的构建和原生模块。在一开始就说明目标平台和所需的任何原生能力，让生成的代码选用正确的库。

import { Text, Button, View } from "react-native";
import { useState } from "react";

export default function Counter() {
  const [count, setCount] = useState(0);
  return (
    <View>
      <Text>Count: {count}</Text>
      <Button title="Add" onPress={() => setCount(count + 1)} />
    </View>
  );
}