欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Facebook发布全新JavaScript引擎:Hermes

程序员文章站 2023-11-04 12:36:34
摘要: JS引擎开始升级了... 原文: "技术栈中的爱马仕?Facebook发布全新JavaScript引擎:Hermes" 作者:Carson_Ho "Fundebug" 经授权转载,版权归原作者所有。 前言 目前,用户的流畅体验是用户能长期使用某个移动客户端应用App的重要指标之一,因此,移动 ......

摘要: js引擎开始升级了...

fundebug经授权转载,版权归原作者所有。

前言

  • 目前,用户的流畅体验是用户能长期使用某个移动客户端应用app的重要指标之一,因此,移动客户端应用app的性能问题备受关注。
  • 最近,一个崭新的javascript引擎面世:hermes,它是facebook在chain react 2019 大会上发布 & 用于在react native应用提高性能的,今天,我将进行全面介绍。

Facebook发布全新JavaScript引擎:Hermes

1. 简介

facebook在chain react 2019 大会上发布的一个崭新javascript引擎

已开源 & 用于移动端react native应用的集成

2. 作用

2.1 背景

  • 用户的流畅体验是用户能长期使用某个移动客户端应用app的重要指标之一,因此,移动客户端应用app的性能问题备受关注
  • 针对react native应用,流畅度等性能问题一直被人诟病

2.2 问题

facebook基于多方性能数据分析,发现javascript引擎本身就是影响react native应用启动性能的重要因素

2.3 解决方案

构建一个全新的javascript引擎,针对react native应用,去提高移动客户端应用app的性能

特别注意:hermes主要面向移动端react native应用的性能优化,对浏览器 & node.js 等服务端基础架构并不适用。

3. 性能提升表现

对于react native应用(基于javascript引擎)来说,用户感知最明显的性能体验包括:

  • 应用程序可用的时间(tti)
  • 安装包下载大小(android apk 大小)
  • 内存利用率

根据facebook给出的官方性能优化性能数据如下:

Facebook发布全新JavaScript引擎:Hermes

示意图

从上述数据可知,hermes引擎提升性能较为明显:

  • 在应用程序可用的时间上,hermes能提升一倍的时间效率
  • 在安装包下载大小下,hermes能减少50%的大小
  • 在内存利用率上,hermes能节省30%的内存使用

4. 设计原理

为了提升react native应用的性能表现,hermes引擎的设计主要是从是两个方面入手:编译方式 & 垃圾回收策略

4.1 编译方式

a. 字节码预编译

Facebook发布全新JavaScript引擎:Hermes

b. 无jit编译

Facebook发布全新JavaScript引擎:Hermes

4.2 垃圾回收策略

Facebook发布全新JavaScript引擎:Hermes

5. 使用特点

在实际使用hermes时,具备3个优点:懒编译、兼容性好 & 调试体验好,具体如下:

Facebook发布全新JavaScript引擎:Hermes

  • 特别注意:在实际使用hermes时,需对build.gradle文件做更改 & 重新编译
project.ext.react = [
  entryfile: "index.js",
  enablehermes: true
]

6. 总结

  • 本文全面讲解了facebook在chain react 2019 大会上发布的一个崭新javascript引擎:hermes
  • 下面我将继续对 hermes引擎中的知识进行深入讲解 ,感兴趣的同学可以继续关注本人博客carson_ho的开发笔记

关于fundebug

fundebug专注于javascript、微信小程序、微信小游戏、支付宝小程序、react native、node.js和java线上应用实时bug监控。 自从2016年双十一正式上线,fundebug累计处理了10亿+错误事件,付费客户有阳光保险、核桃编程、荔枝fm、掌门1对1、微脉、青团社等众多品牌企业。欢迎大家免费试用!