Hermes: Hermes is slower then JSC when using cached JSRuntime

[chufengma]

My React Native project is different from the official React Native project：I cached ReactInstanceManager when user leave the last ReactNative Activity. When the user enters the same page again, the cached ReactInstanceManager is used.

When I use jsc, it takes 200 ms for me to enter the same page the second time, but more than 500 ms for hermes.

I'm very interested in hermes, but this problem is blocking me now. Can you give me some help or ideas?

[axemclion]

We would love to help. Is there a way you could create a test project that is similar to your app ? That will help us recreate and investigate this scenario better.

[chufengma]

@axemclion Thanks very much

This is my demo project:

https://github.com/chufengma/HermesTestDemo

Time-consuming comparison between JSC and Hermes

run demo

Run with Hermes

// Run with Hermes
# gradle.properties
useHermesEngine=true
# shell
./gradlew installDebug

// Run with JSC
# gradle.properties
useHermesEngine=false
# shell
./gradlew installDebug

[axe-fb]

@chufengma - looks like there are some compile errors in the project - something around (ReactBuildConfig.DEBUG) not found at a bunch of places. Could you please look at them ?

[chufengma]

@axe-fb
Sorry, I added ReactBuildConfig to the .gitignore file. Please pull and try again.

[mhorowitz]

I don't know gradle very well. Is installDebug giving you the debug Hermes build, or the release build? The latter will perform better.

[chufengma]

@mhorowitz installRelease has the same problem.

[chufengma]

@axe-fb any updates?

[axe-fb]

Hey, I am still having trouble running the demo project - this time the error is around couldn't find "libun7zip.so"

Can I request you to remove all un-needed dependencies, and have a smaller repro, so that it is easier for me to run this project ?

Also, could you add a ReactMarker.addListener so that we can instrument all the other times that React Native takes ? This way, we will be able to separate React Native and Hermes concerns.

[axe-fb]

@chufengma - any update ? Wanted to take a look at this over the weekend.

[chufengma]

@axe-fb updated https://github.com/chufengma/HermesTestDemo today and remove some un-needed dependencies(I'm sorry it took so long to update -。-).

[axemclion]

@chufengma , I ran the tests 20 times, with updated ReactMarker listeners. I did not find that Hermes is slower. Here are the results.

Could you also get similar data, with the markers (sent you a PR) to see if you have a similar issue ?

| Marker | JSC | Hermes |
|-------------------------------------------|-----|-----|
| REACT_CONTEXT_THREAD_START | 0 | 0 |
| REACT_CONTEXT_THREAD_END | 1 | 1 |
| VM_INIT | 1 | 1 |
| VM_INIT | 1 | 1 |
| LOAD_REACT_NATIVE_SO_FILE_START | 36 | 32 |
| LOAD_REACT_NATIVE_SO_FILE_END | 36 | 34 |
| CREATE_REACT_CONTEXT_START | 52 | 35 |
| PROCESS_PACKAGES_START | 54 | 39 |
| PROCESS_CORE_REACT_PACKAGE_START | 55 | 46 |
| PROCESS_CORE_REACT_PACKAGE_END | 60 | 47 |
| CREATE_MODULE_START | 67 | 47 |
| CREATE_MODULE_END | 69 | 47 |
| CREATE_MODULE_START | 69 | 47 |
| CREATE_MODULE_END | 69 | 48 |
| CREATE_MODULE_START | 69 | 49 |
| CREATE_MODULE_END | 72 | 49 |
| CREATE_MODULE_START | 72 | 49 |
| CREATE_MODULE_END | 72 | 50 |
| CREATE_MODULE_START | 72 | 50 |
| CREATE_MODULE_END | 73 | 51 |
| CREATE_MODULE_START | 73 | 51 |
| CREATE_MODULE_END | 74 | 51 |
| CREATE_MODULE_START | 74 | 51 |
| CREATE_MODULE_END | 74 | 52 |
| CREATE_MODULE_START | 74 | 52 |
| CREATE_MODULE_END | 75 | 52 |
| CREATE_MODULE_START | 75 | 52 |
| CREATE_MODULE_END | 75 | 53 |
| CREATE_MODULE_START | 75 | 53 |
| CREATE_MODULE_END | 76 | 54 |
| CREATE_MODULE_START | 76 | 54 |
| CREATE_MODULE_END | 77 | 55 |
| CREATE_MODULE_START | 77 | 55 |
| CREATE_MODULE_END | 79 | 56 |
| CREATE_MODULE_START | 79 | 56 |
| CREATE_MODULE_END | 80 | 56 |
| CREATE_MODULE_START | 80 | 56 |
| CREATE_MODULE_END | 80 | 57 |
| CREATE_MODULE_START | 80 | 57 |
| CREATE_MODULE_END | 81 | 58 |
| CREATE_MODULE_START | 81 | 58 |
| CREATE_MODULE_END | 82 | 79 |
| CREATE_MODULE_START | 82 | 79 |
| CREATE_MODULE_END | 100 | 80 |
| CREATE_MODULE_START | 100 | 80 |
| CREATE_MODULE_END | 101 | 80 |
| CREATE_MODULE_START | 101 | 80 |
| CREATE_MODULE_END | 102 | 81 |
| CREATE_MODULE_START | 102 | 81 |
| CREATE_MODULE_END | 102 | 81 |
| CREATE_MODULE_START | 102 | 81 |
| CREATE_MODULE_END | 103 | 82 |
| CREATE_MODULE_START | 103 | 82 |
| CREATE_MODULE_END | 103 | 82 |
| CREATE_MODULE_START | 103 | 82 |
| CREATE_MODULE_END | 103 | 82 |
| CREATE_MODULE_START | 103 | 82 |
| CREATE_MODULE_END | 103 | 83 |
| CREATE_MODULE_START | 103 | 83 |
| CREATE_MODULE_END | 104 | 83 |
| PROCESS_PACKAGES_END | 104 | 83 |
| BUILD_NATIVE_MODULE_REGISTRY_START | 104 | 84 |
| BUILD_NATIVE_MODULE_REGISTRY_END | 105 | 88 |
| CREATE_CATALYST_INSTANCE_START | 105 | 88 |
| CREATE_CATALYST_INSTANCE_END | 113 | 97 |
| PRE_RUN_JS_BUNDLE_START | 114 | 99 |
| RUN_JS_BUNDLE_START | 114 | 100 |
| PRE_SETUP_REACT_CONTEXT_START | 115 | 100 |
| PRE_SETUP_REACT_CONTEXT_END | 115 | 102 |
| SETUP_REACT_CONTEXT_START | 115 | 102 |
| ATTACH_MEASURED_ROOT_VIEWS_START | 116 | 103 |
| ATTACH_MEASURED_ROOT_VIEWS_END | 116 | 103 |
| SETUP_REACT_CONTEXT_END | 123 | 103 |
| NATIVE_MODULE_INITIALIZE_START | 123 | 103 |
| INITIALIZE_MODULE_START | 123 | 103 |
| INITIALIZE_MODULE_END | 123 | 103 |
| INITIALIZE_MODULE_START | 123 | 104 |
| INITIALIZE_MODULE_END | 123 | 104 |
| INITIALIZE_MODULE_START | 123 | 104 |
| INITIALIZE_MODULE_END | 123 | 104 |
| INITIALIZE_MODULE_START | 123 | 104 |
| INITIALIZE_MODULE_END | 123 | 105 |
| INITIALIZE_MODULE_START | 123 | 105 |
| INITIALIZE_MODULE_END | 124 | 105 |
| INITIALIZE_MODULE_START | 124 | 105 |
| INITIALIZE_MODULE_END | 124 | 105 |
| INITIALIZE_MODULE_START | 124 | 105 |
| INITIALIZE_MODULE_END | 124 | 105 |
| INITIALIZE_MODULE_START | 124 | 105 |
| INITIALIZE_MODULE_END | 124 | 105 |
| INITIALIZE_MODULE_START | 124 | 105 |
| INITIALIZE_MODULE_END | 124 | 105 |
| INITIALIZE_MODULE_START | 124 | 105 |
| INITIALIZE_MODULE_END | 124 | 105 |
| INITIALIZE_MODULE_START | 124 | 106 |
| INITIALIZE_MODULE_END | 124 | 106 |
| INITIALIZE_MODULE_START | 124 | 106 |
| INITIALIZE_MODULE_END | 124 | 106 |
| INITIALIZE_MODULE_START | 124 | 106 |
| CREATE_MODULE_START | 124 | 106 |
| CREATE_UI_MANAGER_MODULE_START | 124 | 106 |
| CREATE_VIEW_MANAGERS_START | 126 | 106 |
| CREATE_VIEW_MANAGERS_END | 161 | 106 |
| CREATE_UI_MANAGER_MODULE_CONSTANTS_START | 163 | 106 |
| NATIVE_MODULE_SETUP_START | 172 | 106 |
| GET_CONSTANTS_START | 172 | 107 |
| CREATE_MODULE_START | 172 | 107 |
| INITIALIZE_MODULE_START | 172 | 109 |
| INITIALIZE_MODULE_END | 172 | 112 |
| CREATE_MODULE_END | 172 | 114 |
| CONVERT_CONSTANTS_START | 187 | 114 |
| CONVERT_CONSTANTS_END | 187 | 118 |
| GET_CONSTANTS_END | 187 | 119 |
| NATIVE_MODULE_SETUP_END | 190 | 119 |
| NATIVE_MODULE_SETUP_START | 197 | 119 |
| GET_CONSTANTS_START | 197 | 119 |
| CREATE_MODULE_START | 197 | 119 |
| INITIALIZE_MODULE_START | 199 | 119 |
| INITIALIZE_MODULE_END | 199 | 119 |
| CREATE_MODULE_END | 199 | 119 |
| CONVERT_CONSTANTS_START | 200 | 119 |
| CONVERT_CONSTANTS_END | 200 | 120 |
| GET_CONSTANTS_END | 201 | 122 |
| NATIVE_MODULE_SETUP_END | 202 | 122 |
| NATIVE_MODULE_SETUP_START | 211 | 123 |
| GET_CONSTANTS_START | 211 | 123 |
| CONVERT_CONSTANTS_START | 217 | 124 |
| CONVERT_CONSTANTS_END | 217 | 124 |
| GET_CONSTANTS_END | 217 | 126 |
| NATIVE_MODULE_SETUP_END | 218 | 126 |
| NATIVE_MODULE_SETUP_START | 220 | 126 |
| GET_CONSTANTS_START | 220 | 127 |
| CONVERT_CONSTANTS_START | 220 | 127 |
| CONVERT_CONSTANTS_END | 220 | 128 |
| GET_CONSTANTS_END | 220 | 131 |
| NATIVE_MODULE_SETUP_END | 223 | 131 |
| NATIVE_MODULE_SETUP_START | 236 | 131 |
| GET_CONSTANTS_START | 237 | 135 |
| CREATE_MODULE_START | 237 | 135 |
| CREATE_MODULE_END | 238 | 135 |
| CONVERT_CONSTANTS_START | 239 | 135 |
| CONVERT_CONSTANTS_END | 239 | 136 |
| GET_CONSTANTS_END | 239 | 141 |
| NATIVE_MODULE_SETUP_END | 240 | 141 |
| NATIVE_MODULE_SETUP_START | 254 | 141 |
| GET_CONSTANTS_START | 254 | 141 |
| CONVERT_CONSTANTS_START | 255 | 141 |
| CONVERT_CONSTANTS_END | 255 | 142 |
| GET_CONSTANTS_END | 255 | 143 |
| NATIVE_MODULE_SETUP_END | 256 | 143 |
| NATIVE_MODULE_SETUP_START | 260 | 143 |
| NATIVE_MODULE_SETUP_START | 260 | 143 |
| GET_CONSTANTS_START | 260 | 143 |
| CONVERT_CONSTANTS_START | 260 | 143 |
| CONVERT_CONSTANTS_END | 261 | 144 |
| GET_CONSTANTS_END | 261 | 144 |
| NATIVE_MODULE_SETUP_END | 262 | 144 |
| NATIVE_MODULE_SETUP_START | 262 | 150 |
| GET_CONSTANTS_START | 263 | 151 |
| CREATE_UI_MANAGER_MODULE_CONSTANTS_END | 288 | 236 |
| CREATE_UI_MANAGER_MODULE_END | 295 | 246 |
| INITIALIZE_MODULE_START | 295 | 246 |
| INITIALIZE_MODULE_END | 296 | 247 |
| CREATE_MODULE_END | 296 | 247 |
| INITIALIZE_MODULE_END | 296 | 247 |
| INITIALIZE_MODULE_START | 296 | 247 |
| INITIALIZE_MODULE_END | 296 | 248 |
| INITIALIZE_MODULE_START | 296 | 248 |
| CONVERT_CONSTANTS_START | 296 | 248 |
| INITIALIZE_MODULE_END | 297 | 248 |
| INITIALIZE_MODULE_START | 297 | 248 |
| INITIALIZE_MODULE_END | 297 | 248 |
| INITIALIZE_MODULE_START | 297 | 248 |
| ON_HOST_RESUME_START | 325 | 271 |
| ON_HOST_RESUME_END | 329 | 274 |
| INITIALIZE_MODULE_END | 336 | 284 |
| INITIALIZE_MODULE_START | 336 | 285 |
| INITIALIZE_MODULE_END | 337 | 285 |
| INITIALIZE_MODULE_START | 337 | 285 |
| INITIALIZE_MODULE_END | 337 | 285 |
| INITIALIZE_MODULE_START | 337 | 285 |
| INITIALIZE_MODULE_END | 337 | 285 |
| INITIALIZE_MODULE_START | 337 | 285 |
| INITIALIZE_MODULE_END | 337 | 285 |
| INITIALIZE_MODULE_START | 338 | 285 |
| INITIALIZE_MODULE_END | 338 | 286 |
| INITIALIZE_MODULE_START | 338 | 286 |
| INITIALIZE_MODULE_END | 338 | 286 |
| INITIALIZE_MODULE_START | 338 | 286 |
| INITIALIZE_MODULE_END | 338 | 286 |
| INITIALIZE_MODULE_START | 338 | 286 |
| INITIALIZE_MODULE_END | 338 | 286 |
| INITIALIZE_MODULE_START | 338 | 286 |
| INITIALIZE_MODULE_END | 338 | 287 |
| NATIVE_MODULE_INITIALIZE_END | 338 | 287 |
| CONVERT_CONSTANTS_END | 345 | 290 |
| GET_CONSTANTS_END | 345 | 290 |
| NATIVE_MODULE_SETUP_END | 361 | 302 |
| CREATE_REACT_CONTEXT_END | 363 | 303 |
| RUN_JS_BUNDLE_END | 363 | 304 |
| CHANGE_THREAD_PRIORITY | 363 | 304 |
| NATIVE_MODULE_SETUP_START | 379 | 307 |
| GET_CONSTANTS_START | 379 | 307 |
| CONVERT_CONSTANTS_START | 379 | 307 |
| CONVERT_CONSTANTS_END | 379 | 307 |
| GET_CONSTANTS_END | 380 | 308 |
| NATIVE_MODULE_SETUP_END | 380 | 308 |
| NATIVE_MODULE_SETUP_START | 383 | 312 |
| NATIVE_MODULE_SETUP_START | 383 | 312 |
| GET_CONSTANTS_START | 383 | 313 |
| CONVERT_CONSTANTS_START | 384 | 313 |
| CONVERT_CONSTANTS_END | 384 | 313 |
| GET_CONSTANTS_END | 384 | 313 |
| NATIVE_MODULE_SETUP_END | 384 | 314 |
| NATIVE_MODULE_SETUP_START | 401 | 321 |
| GET_CONSTANTS_START | 401 | 321 |
| CONVERT_CONSTANTS_START | 402 | 321 |
| CONVERT_CONSTANTS_END | 402 | 321 |
| GET_CONSTANTS_END | 402 | 321 |
| NATIVE_MODULE_SETUP_END | 402 | 322 |
| CONTENT_APPEARED | 837 | 673 |

[chufengma]

@axemclion My problem is that when loading RN pages for the second time, Hermes is slower than JSC.

When I start my app, click the Load RN undle button, and through the ReactMaker I can see the data listed above. These data show that Hermes is faster than JSC without caching.

But when I press the return key to exit the RN page and click the Load RN bundle button again, this time using caching, Hermes is much slower than jsc, and at this time only the following logs can be seen through ReactMaker:

ON_HOST_RESUME_START null 0: 399215
ON_HOST_RESUME_END null 0: 399220
CONTENT_APPEARED CtripApp 41: 399977

[chufengma]

After upgrading to 0.2.1, the problem is solved.
Thanks @axemclion