Importing from Hermes

Hermes is a javascript engine developed by facebook for use in react-native applications. For the most up-to-date instructions on how to take a profile, see Profiling with Hermes.

Profiling in Development Mode

To record a sampling profiler from the Dev Menu:

1. Navigate to your running Metro server terminal.
2. Press d to open the Dev Menu.
3. Select Enable Sampling Profiler.

5. Execute your JavaScript by in your app (press buttons, etc.)
6. Open the Dev Menu by pressing d again.
7. Select Enable Sampling Profiler again (this is currently a bug and might correctly say disable in the future) to stop recording and save the sampling profiler.

A toast will show the location where the sampling profiler has been saved, usually in /data/user/0/com.appName/cache/*.cpuprofile

You can then extract the profile from your emulator / device using the following command:

npx react-native@latest profile-hermes [destinationDir]

To view, drag and drop the profile from destinationDir into Speedscope.

Profiling in Release Mode

To profile hermes in a release build of your app, you can use the react-native-release-profiler npm package:

yarn add react-native-release-profiler
cd ios && pod install

1. Build your app in release mode
2. Start a profiling session:

import { startProfiling } from 'react-native-release-profiler'

startProfiling()

3. Stop the profiling session:

import { stopProfiling } from 'react-native-release-profiler'

// `true` to save the trace to the phone's downloads folder, `false` otherwise
const path = await stopProfiling(true)

4. Download and process the performance trace from your phone to your PC:

• On Android:

First find your app id. It should look something like com.mypackage and be visible in app/build.gradle in the defaultConfig section:

android {
    defaultConfig {
        applicationId "com.profilern" // <-- This one!
        // ...
    }
}

Then run:

npx react-native-release-profiler --fromDownload --appId <your appId>

• On iOS:

npx react-native-release-profiler --local <path to profile>

To view, drag and drop the profile saved in your current working directory into Speedscope. It should be transformed with sourcemaps!