react-native: Android application becomes super slow on startup after enabling Hermes
Description
After enabling Hermes on my Android app in order to gain performance, the app becomes super slow. Specifically the startup time increases by 50%.
In my case startup time for the native thread sky rockets to 25.5 seconds from 17 seconds before. I am using @axemclion package to measure Android performance as mentioned in #26870 from @TheSavior . I am including logs and some initial troubleshooting below.
React Native version:
0.64.0-rc2 for me but this is the first version I was ever able to activate Hermes without issues as we use mobx symbols and 0.63.x did not work for me.
I suspect though this is something happening since Hermes was introduced as there are other issues as well complaining about performance being affected with Hermes enabled or disabled.
Steps To Reproduce
Not easy to provide that. Providing logs and traces though below.
Expected Results
I’m expecting actually to gain the same 50% that somehow is introduced with the use of Hermes instead of adding it as a delay 😃
Snack, code example, screenshot, or link to a repository:
So I am using @axemclion package to trace as mentioned before. That being said I am attaching the TTI_COMPLETE
id over the View’s container that lands first over my app. This remains stable as I’m enabling / disabling Hermes. I’m acquiring the traces from the JS thread and more specifically from the AXE_PERFLOGGER
that the package attaches over global
variable.
I’m proving these trace logs over the 2 files attached below named marudy-0.64.0-rc2-hermes-disabled.log
& marudy-0.64.0-rc2-hermes-enabled.log
respectively.
I’m also providing an excel file where I pasted these logs and started working my way of investigating where the extra time is introduced. This can be found here. I’m conditionally showing with red background all the processes that take more than half a second to execute. The excel contains both of the runs and all the tasks executed; the first 566 lines are for the run with hermes disabled while the rest below for the run with hermes enabled.
As also mentioned in issue #26870 I have identified some initial observations from the logs provided:
- So far I am seeing that the major delay is being caused by the processes with name
GET_CONSTANTS_START
. There are around 50 of them being executed in my case and until theTTI_COMPLETE
event. Over the run without hermes ALL of them execute within the same ms or the very next one. Over the run with hermes enabled i’m suddenly seeing numbers all the way from 1-6ms which are the fastest ones up to 1121 , 2034 , 3707 ms. This is a huge increase as we can see and these are causing the biggest part of the delay. - On a 2nd note the process with name
CHANGE_THREAD_PRIORITY
also takes double the time it was occupying before. In my case from 567ms all the way up to 1132ms. - On a 3rd note the process with name
CREATE_CATALYST_INSTANCE_END
takes now 2034ms while before it was accounting for 26ms only.
marudy-0.64.0-rc2-hermes-disabled.log marudy-0.64.0-rc2-hermes-enabled.log
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Reactions: 17
- Comments: 16 (3 by maintainers)
A solution: https://reactnative.dev/docs/hermes
Can I somehow disable hermes for debug builds and only use it in release? The debug builds have been super slow for the past couple of years and looks like this will never be fixed.
For people where this is slow, does the bundle you are executing contain JavaScript or is it bytecode? If it is JavaScript, then we’d expect that to be 2-5x slower, and probably means something is broken. When using Hermes the tooling should be creating bytecode bundles.
I found out that my release variant bundle is JS and not bytecode.
Is there a way to generate a release variant with bytecode instead JS? or how to detect what is broken to fix it?
I’m using react-native-cli: 2.0.1 and react-native: 0.63.4 and still having the same issue with android - very slow. @TheSavior: Please re-open the issue ticket