What is Hermes in React Native?
React Native is framework for building Android and iOS application using React and native capabilities. It allows developers to write JavaScript code that will interact with platform APIs and native components to build interactive user interfaces.
To accomplish that, React Native needs an engine to run JavaScript code on mobile devices. Apple includes JavaScriptCore (JSCore) on iOS devices, but Android does not have a JavaScript engine.
So React Native included a version of JSCore in Android builds to execute JavaScript. This resulted in larger Android application packages (APKs) for React Native apps, and some noticeable performance issues.
In 2019, the React Native team announced Hermes as “a new JavaScript engine optimized for React Native.” Android apps built with React Native and Hermes were smaller, interactive faster, and used less memory.
React Native version 0.60.1 (2019) replaced JSCore with Hermes for Android builds. Later in version 0.64 (2021), React Native added support for Hermes on iOS. With one small change to your project’s Podfile, you can include Hermes to improve your app’s performance:
use_react_native!(
:path => config[:reactNativePath],
# to enable hermes on iOS, change `false` to `true` and then install pods
:hermes_enabled => true
)
You’ll want to do some profiling of iOS apps with JSCore and Hermes before committing to the change, but it is exciting to see more alignment between the two platforms.
To read more information about to use Hermes and how to debug it, check out the documentation.
Happy coding!