Skip to main content

使用 Hermes

Hermes 是一个针对 React Native 优化的开源 JavaScript 引擎。对于许多应用来说,与 JavaScriptCore 相比,使用 Hermes 将缩短启动时间、减少内存使用量并缩小应用大小。React Native 默认使用 Hermes,无需额外配置即可启用它。

¥Hermes is an open-source JavaScript engine optimized for React Native. For many apps, using Hermes will result in improved start-up time, decreased memory usage, and smaller app size when compared to JavaScriptCore. Hermes is used by default by React Native and no additional configuration is required to enable it.

打包 Hermes

¥Bundled Hermes

React Native 附带了 Hermes 的打包版本。每当我们发布新版本的 React Native 时,我们都会为你构建一个 Hermes 版本。这将确保你使用的 Hermes 版本与你正在使用的 React Native 版本完全兼容。

¥React Native comes with a bundled version of Hermes. We building a version of Hermes for you whenever we release a new version of React Native. This will make sure you're consuming a version of Hermes which is fully compatible with the version of React Native you're using.

这一变化对于 React Native 的用户来说是完全透明的。你仍然可以使用本页中描述的命令禁用 Hermes。你可以 在此页面上阅读有关技术实现的更多信息

¥This change is fully transparent to users of React Native. You can still disable Hermes using the command described in this page. You can read more about the technical implementation on this page.

确认 Hermes 正在使用

¥Confirming Hermes is in use

如果你最近从头开始创建了一个新应用,你应该在欢迎视图中查看 Hermes 是否已启用:

¥If you've recently created a new app from scratch, you should see if Hermes is enabled in the welcome view:

Where to find JS engine status in AwesomeProject

JavaScript 中将提供 HermesInternal 全局变量,可用于验证 Hermes 是否正在使用:

¥A HermesInternal global variable will be available in JavaScript that can be used to verify that Hermes is in use:

const isHermes = () => !!global.HermesInternal;
提醒

如果你使用非标准方式加载 JS 包,则 HermesInternal 变量可能可用,但你没有使用高度优化的预编译字节码。确认你正在使用 .hbc 文件,并对之前/之后的情况进行基准测试,如下所述。

¥If you are using a non-standard way of loading the JS bundle, it is possible that the HermesInternal variable is available but you aren't using the highly optimised pre-compiled bytecode. Confirm that you are using the .hbc file and also benchmark the before/after as detailed below.

要了解 Hermes 的优势,请尝试对你的应用进行发布构建/部署以进行比较。例如;从项目的根目录开始:

¥To see the benefits of Hermes, try making a release build/deployment of your app to compare. For example; from the root of your project:

npm run android -- --mode="release"

这将在构建时将 JavaScript 编译为 Hermes 字节码,从而提高应用在设备上的启动速度。

¥This will compile JavaScript to Hermes Bytecode during build time which will improve your app's startup speed on device.

切换回 JavaScriptCore

¥Switching back to JavaScriptCore

React Native 还支持使用 JavaScriptCore 作为 JavaScript 引擎。请按照以下说明选择退出 Hermes。

¥React Native also supports using JavaScriptCore as the JavaScript engine. Follow these instructions to opt-out of Hermes.

安卓

¥Android

编辑 android/gradle.properties 文件并将 hermesEnabled 翻转回 false:

¥Edit your android/gradle.properties file and flip hermesEnabled back to false:

# Use this property to enable or disable the Hermes JS engine.
# If set to false, you will be using JSC instead.
hermesEnabled=false

iOS

编辑 ios/Podfile 文件并进行如下所示的更改:

¥Edit your ios/Podfile file and make the change illustrated below:

   use_react_native!(
:path => config[:reactNativePath],
+ :hermes_enabled => false,
# An absolute path to your application root.
:app_path => "#{Pod::Config.instance.installation_root}/.."
)