The latest version of React Native adds support for the Hermes JavaScript engine on iOS and moves to React 17.
Hermes is a lightweight JavaScript engine that Facebook created to optimize running React Native apps on Android. The main benefits promised by Hermes are faster app launch and ahead-of-time code optimization to improve bytecode size and runtime performance:
Hermes is an open source JavaScript engine optimized for running React Native. It improves performance by decreasing memory utilization, reducing download size and decreasing the time it takes for the app to become usable or “time to interactive” (TTI).
Previously available only for Android, Hermes can now be used for React Native apps on iOS, too. Before switching an existing project to Hermes, you should upgrade it to use React Native 0.64 and make sure everything works as expected. After that, you can enable Hermes on iOS by setting hermes_enabled to true in your Podfile. On Android, you can enable Hermes by adding enableHermes: true to your android/app/build.gradle file.
Before moving your React Native app to Hermes you should also make sure all of your dependencies are compatible and that you do not use unsupported features. In this respect too, React Native 0.64 improves things by adding support for Proxy, which is required for compatibility with packages such as react-native-firebase and state management package mobx.
As a last note, Hermes releases are strictly tied to specific React Native versions, so you should always ensure to use matching versions.
Another change in React Native 0.64 aimed to improve launch time is enabling inline require by default. This option was already present in previous Metro versions, but was available as an opt-in. In short, inline requires will delay the execution of a JavaScript module until the moment they are actually used, instead of loading it at launch.
As mentioned, React Native 0.64 moves to React 17, which does not add any new developer-facing features. React 17 mostly lays the foundation for simplifying the process of upgrading an existing app to a newer React version. This is achieved by enabling mixing up two different versions of React on a single page, which makes it possible to upgrade an app component by component. Under the hood, React 17 changes the way event delegation works by attaching event handlers to the root DOM container where React is rendered instead of at the document level. While this change enables different React versions to coexist, it also introduces the chance of backward incompatibility for some apps.
