文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

React Native怎么采用Hermes热更新打包

2023-06-30 14:41

关注

这篇文章主要介绍“React Native怎么采用Hermes热更新打包”,在日常操作中,相信很多人在React Native怎么采用Hermes热更新打包问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”React Native怎么采用Hermes热更新打包”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

1, 背景

如果我们打开RN的Android源码,在build.gradle中回看到这样一段代码。

  if (enableHermes) {        def hermesPath = "../../node_modules/hermes-engine/android/";        debugImplementation files(hermesPath + "hermes-debug.aar")        releaseImplementation files(hermesPath + "hermes-release.aar")    } else {        implementation jscFlavor    }

此段代码的含义是,如果开启了就采用新的hermes,如果未开启则采用老的jsc加载引擎。Hermes 是专门针对 React Native 应用而优化的全新开源 JavaScript 引擎。对于很多应用来说,启用 Hermes 引擎可以优化启动时间,减少内存占用以及空间占用。

2,热更新传统方案

在传统的热更新方案中,我们实现热更新需要借助code-push开源方案,热更新包的发布有两种方式:

如果采用code-push release-reactapp热更新后,杀掉进程重新进入,app首屏加载的时候速度会很慢,甚至可能出现白屏。这是因为生成的bundle只是通过babel编译转码,然后经过js压缩和削减,代码的执行效率并不高。

React Native怎么采用Hermes热更新打包

而开启Hermes引擎后,可以执行纯文本的 JS 代码,效率比替换js引擎前更低,执行效率也更高。

3,使用Hermes打包

首先,我们执行react-native bundle命令进行打包,比如。

react-native bundle --platform android --entry-file index.android.js --bundle-output ./bundles/index.android.bundle --assets-dest ./bundles --dev false

接下来,我们需要将bundle转成字节码。转化前,我们需要先下载hermes-engine。

npm i hermes-engine

接着,执行如下命令将bundle转换成字节码

 cd node_modules/hermes-engine/oxs-bin ./hermesc -emit-binary -out index.android.bundle.hbc /Users/xxxx/work/react-native/app/bundles/index.android.bundle

将之前bundle目录下的index.android.bundle删掉,将当前的index.android.bundle.hbc重命名为index.android.bundle,再移动到之前bundle目录下。最后,使用下面的命令执行 bundle热更新包的发布。

code-push release AndroidAppNamexx ./bundles 1.0.0 --d Staging --des "描述" --m true

使用这种方式后,下次有热更新的时候,加载的速度比之前也有明显的提升,特别是bundle包内容比较大的时候。

到此,关于“React Native怎么采用Hermes热更新打包”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯