183 ：731こと電車男 ：04/03/16 22:47
俺もエルメスが高級ブランドだってことは知ってたけど
JavaScriptエンジンまで作ってるとは知らなかったよ…＿|￣|○
TL;DR
Hermesを使用することで、Androidビルドの
- アプリ起動時間の高速化
- メモリ使用量の大幅な削減
が可能。
👇スピードアップ。
Hermesとは
ReactNative用のJSエンジン。
ビルド時にJavaScriptをバイトコードにプリコンパイルすることで、実行時のタスクを減らし、起動時間の高速化やメモリ使用量の削減を実現している。
通常、JavaScriptは実行時に解析されるため、あらかじめこれをビルド時に行うことで高速化できる。
メモリ使用が削減できれば、デバイスによる強制終了の可能性もへり、ひいては利用時間やUXの向上も見込まれる。
Hermesの有効化
公式ドキュメントに従う。
https://reactnative.dev/docs/hermes
android/app/build.gradle
project.ext.react = [
entryFile: "index.js",
- enableHermes: false // clean and rebuild if changing
+ enableHermes: true // clean and rebuild if changing
]
ビルドファイルを一旦クリーン
$ cd android && ./gradlew clean
起動（デバッグビルドでは、これまで通りのビルドが採用されるので、ホットリロードの速度には影響がない）
$ npx react-native run-android
リリースビルドで起動
Hermesが有効になったビルドで起動する。
$ npx react-native run-android --variant release
iOSは変わらない
iOS では、Safariにも使用されるエンジンが使用されるため、Hermesは使用できない。
（ただし、RN開発者ならわかる通りiOSはすでに最適化されているので動作は比較的軽快）
相性の悪いライブラリもあるので注意
Hermesがサポートしていない構文や機能を使用しているライブラリと噛み合わない場合もあるので、注意も必要。