Aller au contenu
useffect.sh
Planifier 30 min avec un senior
Performance

Hermes

Le moteur JavaScript de Meta pour React Native, par défaut depuis la 0.70, qui précompile le bundle en bytecode au build.

Définition

Hermes est le moteur JavaScript open source développé par Meta spécifiquement pour React Native. Il est le moteur par défaut depuis React Native 0.70 et remplace JavaScriptCore, le moteur de Safari qu’utilisait React Native à l’origine. Sa particularité : en build release, le bundle JavaScript est compilé en bytecode Hermes (fichier .hbc) au moment du build, pas sur le téléphone. Le moteur n’a donc plus à parser ni compiler le JavaScript au lancement, ce qui réduit le temps de démarrage, la mémoire utilisée et la taille de l’app. Chaque version de React Native embarque la version de Hermes qui lui correspond. Depuis React Native 0.84, Hermes V1, une nouvelle génération du compilateur et de la VM, est le moteur par défaut sur iOS et Android, après une phase expérimentale en 0.82. React Native DevTools ne fonctionne qu’avec lui : une app repassée sur JavaScriptCore perd le débogueur intégré, points d’arrêt et profiling compris.

Dans une vraie app

Pour vérifier le moteur réellement utilisé, !!global.HermesInternal dans la console suffit, et HermesInternal.getRuntimeProperties() donne la version exacte. Le piège documenté par l’équipe React Native : si le bundle est chargé d’une façon non standard (un bundle téléchargé par un système d’update maison, par exemple), HermesInternal peut être présent alors que l’app charge du JavaScript brut et non du bytecode .hbc. Dans ce cas, le gain de démarrage disparaît sans aucun message d’erreur. Avec EAS Update, le bundle publié est bien compilé en bytecode pour la version d’Hermes du build.

Hermes ne se compare qu’en release. Un build debug garde les sources et les outils de debug, et toute mesure de démarrage faite dessus est fausse. npx expo run:ios --configuration Release ou yarn android --mode release donnent le vrai chiffre. Côté langage, Hermes suit son propre rythme d’implémentation d’ECMAScript ; un polyfill Intl ou une API récente peut manquer, d’où l’intérêt de tester les formats de dates et de nombres sur device plutôt que dans Node.

Pour Hermes V1, le passage est automatique à partir de la 0.84 (Expo SDK 56 et suivants). Revenir à l’ancien Hermes se fait en forçant hermes-compiler à 0.15.0 dans package.json (overrides ou resolutions), avec hermesV1Enabled=false côté Android et RCT_HERMES_V1_ENABLED=0 au pod install, ce qui oblige à recompiler React Native depuis les sources. Il faut une raison précise pour le faire.

Nos offres sur ce sujet

Sources

Les 35 termes du glossaire

Un de ces sujets bloque votre app ?

30 minutes avec un senior pour regarder le problème dans votre code. Gratuit.