在 Devin 中试用 DeepWiki 处理私有仓库
DeepWiki

facebook/react-native

菜单

iOS 应用初始化

相关源文件

本文档解释了 React Native 应用在 iOS 上的初始化过程，涵盖了 App Delegate 设置、桥接/运行时初始化、根视图创建和组件挂载等过程。有关初始化后组件渲染的信息，请参阅 iOS 组件渲染。

概述

React Native 中的 iOS 应用初始化遵循一个将 iOS 原生代码与 JavaScript 桥接的特定流程。该过程在 iOS 启动应用程序并调用 AppDelegate 时开始，后者初始化 React Native 的运行时并渲染根组件。

iOS 应用初始化流程

来源

AppDelegate 和入口点

iOS 应用初始化始于 RCTAppDelegate，这是一个实现了标准的 iOS UIApplicationDelegate 协议以处理应用程序启动和配置的类。

RCTAppDelegate

RCTAppDelegate 类是 React Native iOS 应用的默认实现，提供了

  1. application:didFinishLaunchingWithOptions: 方法的实现
  2. React Native 运行时环境的创建
  3. 根视图和窗口的设置

来源

应用程序启动流程

当 iOS 应用程序启动时，系统会调用 application:didFinishLaunchingWithOptions:，它会初始化 React Native 环境

  1. 创建 RCTReactNativeFactory 实例
  2. 如果 automaticallyLoadReactNativeWindow 为 true（默认），则调用 loadReactNativeWindow:
  3. 创建并配置应用程序窗口和根视图控制器

loadReactNativeWindow: 方法

  1. 从 rootViewFactory 获取根视图
  2. 创建窗口和根视图控制器
  3. 将根视图控制器设置为窗口并使其可见

来源

React Native Factory 和配置

RCTReactNativeFactory 负责根据提供的配置初始化 React Native 环境。

工厂配置

该工厂使用功能标志来确定架构模式

功能标志描述
fabricEnabled控制是否使用 Fabric 渲染器
turboModuleEnabled控制是否使用 TurboModules
bridgelessEnabled控制是否使用新的无桥接架构

这些标志决定了是使用旧的桥接还是带 React Host 的新架构。

来源

根视图工厂

RCTRootViewFactory 负责根据所选架构创建根视图

来源

桥接与无桥接初始化

React Native 支持两种初始化架构模式

旧版桥接架构

在旧版架构中

  1. 创建 RCTBridge 来管理 JavaScript 和原生代码之间的通信
  2. 为 JavaScript 运行时（Hermes 或 JSC）创建 JavaScript 执行器工厂
  3. 桥接加载 JavaScript 包
  4. 创建 RCTRootView 以渲染根组件

来源

新架构（无桥接）

在新架构中

  1. 创建 RCTHost 来替代桥接
  2. Host 直接使用 JSI 初始化 JavaScript 运行时
  3. 为根组件创建 RCTFabricSurface
  4. 使用 RCTSurfaceHostingProxyRootView 来托管 Fabric Surface

来源

JavaScript 运行时设置

在初始化期间，React Native 配置 JavaScript 运行时环境

JavaScript 引擎选择

React Native 支持多种 JavaScript 引擎

引擎描述
HermesReact Native 的默认 JavaScript 引擎
JSCJavaScriptCore，备用的 JavaScript 引擎

特定引擎通过 USE_HERMES 构建标志在构建时选择。

来源

JavaScript 执行器工厂

JavaScript 执行器工厂根据所选引擎创建，并使用必要的绑定配置运行时

  1. 对于 TurboModules，初始化 TurboModule 系统
  2. 为同步执行设置 RuntimeScheduler
  3. 安装 JavaScript 绑定以与原生代码通信

来源

组件注册与挂载

在初始化期间，React Native 设置组件注册系统

组件视图工厂

RCTComponentViewFactory 管理可在 JavaScript 中使用的原生 UI 组件的注册

  1. 核心组件会自动注册
  2. 第三方组件可以通过 thirdPartyFabricComponentsProvider 进行注册
  3. 如果找不到组件，则会回退到旧版互操作或 UnimplementedView

来源

依赖注入系统

React Native 使用依赖提供程序来注入平台特定的实现

  1. RCTDependencyProvider 协议定义了模块发现的接口
  2. 图片加载器、数据解码器和 URL 处理程序通过此系统注册
  3. 第三方 Fabric 组件也在此处注册

来源

完整的初始化流程

下图展示了 iOS 应用初始化的完整流程

来源

总结

React Native 中的 iOS 应用初始化遵循以下关键步骤

  1. 系统在 RCTAppDelegate 中调用 application:didFinishLaunchingWithOptions:
  2. 创建 RCTReactNativeFactory 来管理初始化过程
  3. 根据功能标志，初始化旧版桥接或新的无桥接架构
  4. 使用 RCTRootViewFactory 创建根视图
  5. 设置 JavaScript 运行时（Hermes 或 JSC）
  6. 注册可在 JavaScript 中使用的组件
  7. 将根视图附加到视图控制器和窗口
  8. JavaScript 应用程序代码开始执行

此初始化过程构成了 React Native 应用程序的基础，将原生 iOS 环境与 JavaScript 运行时连接起来，以实现跨平台开发。