Herina: React Native 热更新开发套件,为 iOS 与 Android 提供模块动态加载、代码拆包支持

2023-01-26 21:03:36 +08:00
 hectorchong

介绍

Herina 是为 React Native App 提供动态化能力的开发套件。通过提供简单易用的 JS API ,为你能够轻而易举地为 App 加入热更新功能。并且,你还可以使用 import() 从远程服务器动态导入模块,使用此项功能无需额外配置。

在底层,Herina 使用 Metro 作为 Bundle 构建工具。它们之间的关系就像 Vite 之于 Rollup 或 ESBuild 。当构建完成之后,Herina 生成 Bundle 的 AST 分析代码,并将里面的模块拆分到不同类型的 Chunk 内。

功能

安装

yarn add @herina-rn/core @herina-rn/client
cd ios && pod install

代码拆分

Herina 将 Bundle 拆分为三种不同的 Chunk:

使用

Herina 提供两种更新方式:全量更新、递增式更新。

在更新之前,请先调用 registerUpdateManager 注册 UpdateManager。第一个参数是可选的,它代表的是所访问资源(通常为生成的 Bundle 、Chunk )的 Base URL ,若此参数未被定义,将读取原始 Bundle 内的 Base URL 。

import { registerUpdateManager } from "@herina-rn/client";

const manager = registerUpdateManager("https://hector.im");

全量更新

若使用全量更新,将从服务器下载新的 Bundle 以替换原始的 Bundle 。

import { getUpdateManager } from "@herina-rn/client";

const onUpdateBundle = async () => {
  // 已调用 `registerUpdateManager`
  const manager = getUpdateManager();

  await manager.requestBundleUpdate();

  // 若此参数为 true ,将在 Bundle 替换后重载 App
  manager.applyBundleUpdate(true);
};

递增式更新

若使用递增式更新,运行时将发送一个请求知晓是否有可用的更新,并将更新下载下来,然后生成一个新的 Bundle 替换来原始的。

import { getUpdateManager } from "@herina-rn/client";

const onUpdateByIncremental = async () => {
  const manager = getUpdateManager();

  await manager.requestIncrementalUpdates();

  manager.applyIncrementalUpdate(true);
};

使用要求

为使用 Herina ,需要对原生代码进行修改。若你没有 iOS 或 Android 的原生开发经验,你可参考文档中的配置章节。

使用限制

目前,Herina 仅限用于生产模式,并且不会输出 Sourcemap 。若你正在使用如 Sentry 这样的性能监控,我正在开发为它提供支持。

联系 & 支持

Herina 按现状提供。供您参考,Herina 目前是我工作的一部分,但这不意味这是永久性的。如果我被安排到其它工作,我将仍尽量抽出时间提供技术支持。

不必犹豫提交 Issue 或 Pull Request 。如果你有想法要和我分享,你可以联系我,我会尽快回复。

License

MIT

GitHub: https://github.com/Hector-Chong/herina 技术文档: https://herina.hector.im

1744 次点击
所在节点    分享创造
7 条回复
wingkwanli888
2023-01-26 21:33:27 +08:00
App 开了 hermes 引擎的是不是不支持?
hectorchong
2023-01-26 21:58:03 +08:00
@wingkwanli888 启用 Hermes 引擎或使用新架构,均提供支持
vitovan
2023-01-27 19:06:47 +08:00
不懂,所以想请教一下:像这种 “从服务器下载新的 Bundle 以替换原始的 Bundle” 的操作,iOS 的 AppStore 审核会有限制吗?
wobuhuicode
2023-01-27 20:06:55 +08:00
和 code push 区别是啥
hectorchong
2023-01-28 11:54:15 +08:00
@vitovan 以前的开发规范提及 JS 的更新似乎只能用在 Webkit ,但后来没再明确这一规定。不过我自己也没遇到审核这个问题。另外现在很多超级 App 做了小程序,小程序更新本质也是 JS 替换,似乎这一方面 Apple 已经睁一只眼闭一只眼了。
hectorchong
2023-01-28 12:08:03 +08:00
@wobuhuicode 如果使用的是海外 CodePush 服务,下发更新速度令人担忧。Herina 侧重的是 Bundle 管理,而不是一整套的 App 签名与发布流程。Herina 提供的配置和 API 都在 JS 层面,轻量易用的同时,减少非原生开发者的负担。此外,Herina 通过 Git 日志来生成补丁包,而不是直接全量替换(当然也支持这一功能)。Herina 还支持使用 `import()` 动态引入外部模块等。
nikola11
49 天前
通常为生成的 Bundle 这里所说的 bundle 是 apk 和 ipa 么

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/910753

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX