当前位置: 首页 > news >正文

React Native页面加载流程

继上一篇,看下React Native加载流程。原生工程中MainActivity通过RN引擎(React Native Host)找到并加载RN工程打包后的js代码,把RN页面渲染在原生activity界面上。

看下那个最简单demo的详细加载流程。

1、初始化加载底层库

2、RN引擎(ReactNativeHost)初始化

getPackages函数加载RN核心包。(还可以再加载其他包)

getBundleAssetName函数指定bundle文件位置

isHermesEnabled = true启用 JS 引擎。

getJsMainModuleName函数指定React Native应用的js入口文件路径。即对应RN工程的这个文件:

3、MainActivity继承了ReactActivity, 通过ReactActivityDelegate关联到了RN引擎。

getMainComponentName函数作用是告知React native框架加载哪个js组件作为应用根视图。

4、RN引擎读取并解析bundle文件

这里是加载apk的assets目录里的index.android.bundle。 MainApplication代码里指定了。

5、RN引擎渲染App.tsx到MainActivity

解析完 bundle 后,找到index.js中注册的根组件(App.tsx),转换成原生 View,渲染到 MainActivity 的界面上。

可以看出index.js中的App就是App.tsx文件中的App函数。就是调用这个函数渲染的。

ok. 这个demo太简单,后续再修改下,看下原生工程和RN工程间互相通信、接口调用的方式。

http://www.jsqmd.com/news/393324/

相关文章:

  • 告别熬夜肝论文!6款免费AI工具,开题大纲一键生成超省力 - 麟书学长
  • 需求-镀金需求
  • 需求-需求蔓延
  • 2026年哪家企服平台的服务好?综合评测与推荐 - 品牌排行榜
  • 2026波波知了和传统企服公司区别:服务模式与资源整合差异 - 品牌排行榜
  • 2026国内企服平台推荐:助力企业高质量发展的服务新选择 - 品牌排行榜
  • No159:AI中国故事-对话娄敬——戍策长安与AI远见:草根智慧与国都定鼎
  • 2026年值得关注的免费企业服务平台推荐 - 品牌排行榜
  • 2026全屋定制板材品牌有哪些?环保板材选购参考 - 品牌排行榜
  • 2026板材品牌哪家好?环保性能与技术实力综合评测 - 品牌排行榜
  • 手写实现及基于 STL 实现的二分代码比较
  • 商品评论分析|基于Python + Django商品评论分析系统(源码+数据库+文档)
  • 茶叶商城|基于springboot + vue茶叶商城系统(源码+数据库+文档)
  • 【大数据存储与管理】分布式文件系统HDFS:03 HDFS的相关概念
  • 【2024美赛C题】接好运 O奖翻译 2401919 驾驭势头之力:如何主导网球比赛?:从0到1避坑指南(附完整代码)
  • ableau可视化进阶:颜色与交互设计让数据会说话
  • 2026江苏节能门窗销售公司选择全攻略 - 2026年企业推荐榜
  • 2026年系统门窗服务商五强榜单及深度选型指南 - 2026年企业推荐榜
  • 职场人用AI提高工作效率的8个核心方法,全岗位通用
  • 2026年长沙新房装修市场趋势与热门公司综合选购指南 - 2026年企业推荐榜
  • 马尔可夫链全解析:从数学原理到商业应用实战
  • 2026指南:如何精准选择河南可靠的氧系漂白剂直销企业 - 2026年企业推荐榜
  • Armstrong 公理系统是关系数据库理论中函数依赖逻辑推理的完备且可靠的公理化基础
  • 2026上海厨房家装门窗厂商深度评测与选购指南 - 2026年企业推荐榜
  • 2026年广东ROHS检测仪选型白皮书:源头厂家深度剖析与战略适配指南 - 2026年企业推荐榜
  • 2026年浙江AI搜索服务商口碑榜TOP5深度解析 - 2026年企业推荐榜
  • ARM标准汇编(armasm)中的标号(Label)
  • PALS/原位多活动 800 米 UTM 网格亮度温度、后向散射和土壤湿度匹配 V001
  • 2026年固体双氧水实力企业盘点:技术、安全与绿色谁主沉浮? - 2026年企业推荐榜
  • UML四种常见关系的描述基本准确,以下是对这四类关系的规范性梳理与补充说明