ReactNative进阶（三）：ReactNative 项目启动原理介绍_react native 为什么要启动start(5)

文章目录

• • 一、前言
    • 二、概述
    • 三、拓展阅读

---

一、前言

先带大家分析2张架构图，对RN大致的运行加载过程有个印象。

ReactNative系统框架图如下所示:

启动流程图如下所示：

在开始分析之前，先思考一个问题：

为什么ReactNative能像web端一样实现跨端和热更新，同时又有接近Native的性能呢？

ReactNative 的本质是在 JS 端编写 React 代码，通过 JavaScriptCore 引擎，把 JS 端编写的组件和事件转换成 Native 原生组件进行渲染，如下图：

理解 ReactNative 的实现原理，主要是搞清楚 JS 端与 Native 端的通信原理。而要保证 JavaScript 和 Native 具备向对方通信的能力，首先需要搞清楚 RN 在启动的时候都做了哪些事情，这篇文章就是基于 ReactNatve 源码分析的基础上，对 ReactNative 的启动流程进行深入浅出的分析。

二、概述

ReactNative 启动的入口是啥？

• ReactNative 启动是从创建一个 RCTRootView 作为入口视图容器开始运作的，创建 RCTRootView 时，会先创建一个 JSBridge 作为 Native 端与 JS 端交互的桥梁。整个 RN 的启动工作基本都是在创建 JSBridge 时做的。
• JSBridge 的核心是 RCTBatchedBridge ，JSBridge 的工作主要在 RCTBatchedBridge 初始化中处理。启动流程采用 GCD 来进行多线程操作，其中大部分耗时操作是在并发队列com.facebook.react.RCTBridgeQueue中进行的。

RCTBatchedBridge 启动主要进行六个准备工作：

1.加载 JSBundle 代码（并行队列异步执行）
2.初始化 Native Modules（同步执行）
3.初始化 JSCExecutor（与第4步在同一并行队列同时执行）
4.创建 Module 配置表（与第3步在同一并行队列同时执行）
5.注入 Module 配置信息到 JSCExecutor（第3、4步执行完再执行）
6.执行 JSBundle 代码（前5步都执行完再执行）

简单说，JSBridge的初始化就是从加载js源代码（JSBundle）到JSBundle能被原生端执行的过程，具体做了哪些准备工作呢？首先，ReactNative的js组件及事件最后都会映射成原生组件，而所有原生组件暴露给 JavaScript 的类都在Native Modules里。那么，js端是怎么映射到原生组件的呢？是通过Module 配置表找到Native Modules里对应的类。最后，js调用原生方法等交互，及映射成原生代码都是通过JSCExecutor。

所以JSBridge的初始化操作，也就是对JSBundle、Native Modules、Module 配置表、JSCExecutor四个模块进行初始化，具体逻辑流程图如下：

1. 加载 JSBundle 代码(异步)

JSBundle： React代码经过打包后生成的JavaScript 源码和图片等资源文件；
热更新的实质：将JSBundle放在服务器，在合适时机（启动/切换前后台/打开某个页面按需加载等），将JSBundle下载到本地来实现热更新；

将 JavaScript 源码加载到内存中，方便之后注入和执行，这一步中，React 中的 JSX 语法已经转换成 JavaScript。执行代码如下：

[RCTBatchedBridge loadSource: onProgress:]

2. 初始化 Native Modules（同步）
同步初始化所有不能被懒加载的供 JS 端调用的 Native 模块。

Native Modules：所有Native需要暴露给 JS 的类（即标有宏：RCT_EXPORT_MODULE()的类）

主要作用：找到所有 Native 需要暴露给 JavaScript 的类（即被标记有宏：RCT_EXPORT_MODULE()的类），方便后面把这些模块信息注入 JS 端。执行代码如下：

[RCTBatchedBridge initModulesWithDispatchGroup:]

3. 初始化 JSCExecutor（异步）

JSCExecutor 是JavaScriptCore引擎，负责JS端和Native端的通信。

执行代码如下：

### 总结

>技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/topics/618166371)**

后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/topics/618166371)**

![](https://img-blog.csdnimg.cn/img_convert/713a8768bacf2f9fba06153b7f515fea.webp?x-oss-process=image/format,png)