写点什么

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:179110

评论

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

手写vue-router核心原理

hellocoder2029

JavaScript

python如何处理程序异常

芥末拌个饭吧

Python 11月月更

Java For Data Science

Mahipal_Nehra

java; data-science java client Java core Java static

前端食堂技术周刊第 58 期:TypeScript 4.9 RC、10 月登陆浏览器的新功能、Turbopack 真的比 Vite 快 10 倍吗?100 天 Modern CSS 挑战

童欧巴

typescript chrome

知识经济时代,企业应该如何进行知识管理?

Baklib

知识管理

六大招式,修炼极狐GitLab CI/CD “快” 字诀

极狐GitLab

DevOps CI/CD 持续交付 runner 极狐GitLab

HTML5学习

Studying_swz

html 前端 11月月更

【愚公系列】2022年11月 微信小程序-app.json配置属性之entryPagePath

愚公搬代码

11月月更

Verilog语法之测试文件

芯动大师

Verilog 11月月更 测试文件

第四次工业革命的“知识力”,流淌在百度这条创新流水线上

脑极体

SPL比SQL更难了还是更容易了?

石臻臻的杂货铺

sql SPL 11月月更

一年经验年初被裁面试1月有余无果,还遭前阿里面试官狂问八股,人麻了

程序员小毕

Java spring 程序员 面试 程序人生

袋鼠云陈吉平:深耕国产自研数字化技术与服务,持续为客户创造价值

袋鼠云数栈

CSS学习

Studying_swz

CSS 前端 11月月更

Web3开发者指南,比较好用的 NFT API 服务推荐!

NFT Research

区块链 数据分析 NFT

一步步带你设计MySQL索引数据结构

程序知音

Java MySQL 数据库 后端技术

IDC MarketScape :百度安全位居NESaaS市场领导者位置

百度安全

安全 云安全

重磅|九科信息企业级超级自动化平台通过“信息系统安全等级保护三级认证”

九科Ninetech

数据驱动科研,清华大学中国新型城镇化研究院使用 ModelWhale 云端协同创新平台

ModelWhale

人工智能 新基建 云平台 数据科学 学科交叉

细说JavaScript闭包

hellocoder2029

JavaScript

从oracle到mysql模型转换的自动化实现

鲸品堂

语言 & 开发

技术新风口:超级App

FinFish

数字化转型 数字化 技术趋势 Gartner预测

一步步带你设计MySQL索引数据结构

程序知音

Java MySQL 数据库 编程 后端技术

Spring Boot「25」外部配置元数据

Samson

Java spring 学习笔记 spring-boot 11月月更

细说Js中的this

hellocoder2029

JavaScript

涛思数据杨攀:如何寻求产品、商业与技术的平衡

GGV

产品 技术 开发者 商业 SaaS

阿里云丁宇:云原生激活应用构建新范式,Serverless奇点已来

阿里巴巴云原生

阿里云 Serverless 容器 RocketMQ 云原生

设计千万级学生管理系统的考试试卷存储方案

Geek_1264yp

AntDB数据库与DSG强强联手,助力通信行业核心系统国产化

亚信AntDB数据库

aisware antdb AntDB数据库

K8s 有损发布问题探究

阿里巴巴云原生

阿里云 Kubernetes 云原生

vue_Promise学习

Studying_swz

前端 11月月更

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