What Is Hermes?
Updating Older React Native Versions to Support Hermes
React Native applications running on 0.70 will have Hermes enabled by default. For older React Native applications, a Hermes build ships with every React Native version starting from version 0.60.4 for Android builds and version 0.64.0 for iOS. The matching versions eliminate the risk of a dependency mismatch in your React Native application.
To enable Hermes in these older versions of React Native, you’ll need to add some configuration to both your Android and iOS applications.
On Android, edit your android/app/build.gradle file:
project.ext.react = [
On iOS, you make the following changes to your ios/Podfile:
:path => config[:reactNativePath],
:hermes_enabled => true
iOS requires you to install Hermes pods after configuring settings.
Run the following command to install the pods:
cd ios && pod install
Enabling Hermes With Expo
You can also use the Hermes engine for React Native applications built or run using Expo. The Expo library supports Hermes from SDK version 42 on Android and SDK version 43 on iOS to the current version 0.70. It is important to note that standalone applications cannot run Hermes unless built using the Expo Application Services Build.
To enable Hermes in a React Native application, edit your app.json file:
Hermes Performance Optimization for React Native Apps
Hermes mainly affects three metrics of application performance: the application TTI (Time to Interactive), binary size, and memory usage.
Time to Interactive
This reduction in TTI is because Hermes does not run a JIT compiler.
The binary size is the size of the bundled React Native application. Android applications use the APK file format, while iOS apps use a format Apple calls IPA. Using Hermes significantly reduces application size on Android devices.
Memory usage is another critical metric to optimize in applications. An application’s user experience would be negatively affected if it uses too much memory. Hermes implements a Garbage Collector system that regulates memory usage on demand, ensuring an application only uses needed memory space while running.
To configure Chrome to debug Hermes applications, follow these steps.
- Navigate to chrome://inspect inside your Chrome browser.
- Click on the Configure button.
- Inside the on-screen modal, input the server address for the metro bundler running your React Native application and click Done.
You can now debug your React Native application using the Hermes target inspect link.
Why Hermes Is Optimized for Only React Native