QCon北京「鸿蒙专场」火热来袭!即刻报名,与创新同行~ 了解详情
写点什么

JS 引擎大 PK:JSC vs V8 vs Hermes

  • 2019-07-24
  • 本文字数:1771 字

    阅读完需:约 6 分钟

JS引擎大PK:JSC vs V8 vs Hermes

问题

我们开发的一款名为 @WalmartLabs 的安卓应用遇到了内存问题,起因是安卓自带的 JSC 的垃圾回收基本没用。我们试了很多办法来减少这个应用的内存占用,但是都没成功。


当 React Native 的简单列表(FlatList)中有很多项目(我们的情况下有超过 1 千的数量)时问题就更加严重了。在不同页面间跳转时内存用量持续上升,就算清空数据后也不会下降。

救星

几周前 @kudochien 发了一条推文推荐react-native-v8这个包,用了这个包我们就能在安卓的 react-native 项目中打包 V8 取代 JSC 了。



React Native V8 已开源:https://t.co/TPS0dWSGaw

如今在已有的安卓 RN 项目中集成 V8 变得非常简单。

只要把 react-native-v8 node 包添加进来,然后在 build.gradle 中加 15 行代码即可。


那时 jsc-android 也发布了新版本(v 245459.0.00),Facebook 则在 @ChainReactConf 上发布了 Hermes。


于是我们决定对比一下自带JSC(v 241213.1.0)新版JSC(v 245459.0.0)Hermesreact-native-v8的内存占用,还创建了一个演示 repo 来模拟实际用例。



GitHub 地址:https://github.com/bhaskarGyan/react-native-memory-profile


我们设定的用例条件如下:


  1. 带有简单列表,有大约 1 千个项目。

  2. 用大型数组列表模拟在 react 状态中存储/移除大量记录的操作(其中一个记录是 new Array(999999).join(’–’))。

  3. react-navigation测试内存占用。


使用的 ABI 是 x86_64

对比测试

JSC 新出的 245459.0.0 版比之前的 241213.1.0 版处理内存的效率更高,Hermes 成绩排第二,但 react-native-v8 的成绩比它们都强一大截;后者在应用启动时内存占用、简单列表内存管理、大量数据的内存占用和最重要的垃圾回收效率方面都表现出色。

示例应用

测试内容

  • 从首页进入 FlatList(简单列表)。

  • 向下滚动到最后一个项目(一共 870 个项目),然后返回首页。

  • 进入 Memory Hungry Array,添加记录(100 个),然后移除这些记录并返回首页。

  • 从 FlatList 转到 Memory Hungry Array,添加 100 个记录并返回首页。

自带 JSC(v 241213.1.0)测试结果

它是三个方案里表现最差的。它的内存占用非常多,垃圾回收效率也是最低的。


应用启动时内存占用:总计占用 59MB,JS 占用 20MB。


加载 FlatList(870 个项目)后内存占用:总计占用 239MB,JS 占用 128MB。


添加记录后内存占用(添加 16 个记录后应用就崩溃了):总计占用 1153MB,JS 占用 1098MB。


垃圾回收:基本没做。


内存占用图:


新版 JSC(v 245459.0.0)测试结果

新版比旧版的内存占用更小,垃圾回收也正常了。


应用启动时内存占用:总计占用 53MB,JS 占用 15MB。


加载 FlatList(870 个项目)后内存占用:总计占用 191MB),JS 占用 107MB。


添加记录后内存占用:总计占用 714MB,JS 占用 596MB。


垃圾回收:正常工作,内存占用总计降到了 235MB,JS 占用 121MB。


内存占用图:


React-Native-V8 测试结果

应用启动时内存占用:总计占用 40MB,JS 占用 9MB(减少 55%)。


加载 FlatList(870 个项目)后内存占用:总计占用 105MB,JS 占用 36MB(减少 70%)。


添加记录后内存占用:总计占用 82MB,JS 占用 25MB(期间进行了垃圾回收)。


垃圾回收:正常工作,最大内存总计占用为 103MB,JS 占用 36MB,垃圾回收之后内存占用降到大约 78MB,JS 内存占用 14MB。


内存占用图:


Hermes 测试结果

Hermes 是在 7 月 11 日的 @ChainReactConf 上发布的。这是一个开源 JS 引擎,为安卓上的 React Native 应用优化。


应用启动时内存占用:总计占用 33MB,JS 占用 7MB(下降 65%)。


加载 FlatList(870 个项目)后内存占用:总计占用 397MB,JS 占用 110MB。


垃圾回收后内存占用:总计占用 358MB,JS 占用 48MB。


添加记录后内存占用(添加 50 个记录后应用就崩溃了):总计占用 556MB,JS 占用 149MB。


垃圾回收:正常工作,内存占用峰值总计达到 556MB,JS 占用 149MB,垃圾回收后内存占用降到大约 143MB,JS 占用 48MB。


内存占用图:


总结

根据内存占用图的对比结果,react-native-v8 胜出,Hermes 紧随其后。



但在 react-native 中选择 JS 引擎时并没有银弹,具体都取决于实际用例。你应该测试自己的应用使用不同的 JS 引擎时的内存性能,然后选择最适合自己的选项。


还好 react-native 现在让用户可以根据实际用例的情况来选择 JS 引擎。


英文原文:https://dev.to/anotherjsguy/react-native-memory-profiling-jsc-vs-v8-vs-hermes-1c76


2019-07-24 18:178947

评论

发布
暂无评论
发现更多内容

三菱课堂笔记 以太网(MELSEC iQ-R系列篇)

万里无云万里天

自动化 三菱

学习笔记:快速成长的几点方法

老张

成长 学习笔记 成长路线

码住!详解时序数据库不同分类与性能对比

Apache IoTDB

大家来决定:python-office运行时的提示信息,要不要删除?

程序员晚枫

Python 开源 自动化办公

三菱课堂笔记 串行通讯(MELSEC iQ-R系列篇)

万里无云万里天

自动化 三菱

三菱课堂笔记 过程PLC基础

万里无云万里天

自动化 三菱

三菱课堂笔记 过程PLC入门

万里无云万里天

自动化 三菱

30 天 52% 回报:GPT-4o 量化交易机器人

俞凡

人工智能 交易

三菱课堂笔记 变频器维护(800系列对应版)

万里无云万里天

自动化 三菱

三菱课堂笔记 机械安全入门

万里无云万里天

自动化 三菱

三菱课堂笔记 FA网络入门

万里无云万里天

自动化 三菱

mac电脑pdf增强插件:Enfocus PitStop Pro 2022激活版

你的猪会飞吗

Mac软件 苹果软件资源 Mac软件推荐

三菱课堂笔记 编程基础

万里无云万里天

自动化 三菱

三菱课堂笔记 变频器节能

万里无云万里天

自动化 三菱

三菱课堂笔记 变频器A800系列基础(功能篇)

万里无云万里天

自动化 三菱

三菱课堂笔记 配电控制设备基础(电磁接触器篇)

万里无云万里天

自动化 三菱

码住!详解时序数据库不同分类与性能对比

Apache IoTDB

三菱课堂笔记 编程基础(ST语言篇)

万里无云万里天

自动化 三菱

三菱课堂笔记 编程应用(梯形图语言 MELSEC iQ-R系列篇)

万里无云万里天

自动化 三菱

三菱课堂笔记 变频器入门

万里无云万里天

自动化 三菱

三菱课堂笔记 变频器A800系列基础(操作篇)

万里无云万里天

自动化 三菱

三菱课堂笔记 配电控制设备基础(低压断路器篇)

万里无云万里天

自动化 三菱

JS引擎大PK:JSC vs V8 vs Hermes_语言 & 开发_Bhaskar gyan vardhan_InfoQ精选文章