React Native: Hermes → ONでアプリの起動時間はどれだけ改善する？ 【Android編】
React Nativeで開発されたAndroidアプリのJavaScriptエンジンをHermesに切り替えたので、実機(arrows Be3、Galaxy A20、Pixel 3a)を使って起動時間を計測してみました。
JavaScriptエンジンをHermesにスイッチ
U-motionが提供するiOS/Android向けアプリ『UM Utils』はReact Nativeを使って開発しています。React NativeアプリはJavaScriptのロードなど初期化に時間がかかり、特にAndroidのスペックが低い端末の場合に起動が遅くなることがあります。
FacebookはReact Nativeに最適化した『Hermes』というJavaScriptエンジンを開発していて、このエンジンに切り替えることで起動時のJSロード時間の短縮や使用するメモリ容量を削減できると言われています。
そこでUM Utils Android版のJSエンジンをHermesに切り替えてみました。
※ 計測に利用したReact Nativeのバージョンは 0.64 です。
はじめてこのブログを読んだ方へ: U-motionとは？
U-motionは牛の首につけたセンサーを使って活動内容を記録、AIの力で健康状態を解析して畜産農家さんをサポートするモニタリング・システムです。
https://www.desamis.co.jp/product/
富士通 arrows Be3 F-02L
2019年6月7日発売と少し古めの端末ですが、これくらいのスペックの端末を使っているケースも結構ありますね。Hermesを有効にしていないバージョンと、Hermesを有効にしたバージョンそれぞれをインストールして起動時間を計測しました。
Hermes OFF 5秒 → ON 2.7秒 (2.3秒短縮)
サムソン Galaxy A20 SC-02M
2019年11月1日発売の端末です。
Hermes OFF 3.8秒 → ON 2秒 (1.8秒短縮)
Google Pixel 3a
こちらは2019年6月7日発売です。テスト時のOSはAndroid 11です。
Hermes OFF 2.7秒 → ON 1.7秒 (1秒短縮)
結果: 起動時間を大きく改善できた
比較的古めの端末を使って検証してみました。計測はストップウォッチを片手に人力でアプリを起動して行ったので若干ラフですが、いずれの端末でも起動時間の改善ができていました。
もともと起動時間が長かった端末の方が改善が大きいようです。
エンジン入れ替えでJavaScriptの書き方を変える必要があった話
一方、JSエンジンを切り替えるということで想定していなかったバグもみつかりました。Dateを初期化する際に日付の区切りを「/」にしていたらエラーになったというものです。
new Date("2019/10/16").getTime() // HermesをONにしたらエラーこれはGoogle Chromeなどのブラウザや従来のReact Nateveでは問題なく動いていたのですが、Hermesは実装を最小限にするためにDateの正規の仕様しかサポートしていないためにエラーになっていたとのこと(つまり「/」を区切りに使うのはJavaScriptの仕様外)。
JSエンジンを変えるというのは大きな変更なので、従来動いていたコードが動かなくなることもありますね。エンジン切替時には、事前にテスト時間を多めにとったり最悪の場合元のエンジンに戻せるリリース・プランニングが必要となります。
まとめ
JavaScriptエンジンをHermesに切り替えることでAndroid版アプリケーションの起動時間を大幅に短縮することができました。
実はReact Native 0.64ではiOS版でもHermesを使えるようになっています。いずれはこちらもパフォーマンスを測定してみたいと思っています。
この記事を読んでHermesを試してみたいと思った方はこちらの記事などを参考にしてください。
おまけ: U-motion開発部はテクノロジーで農家さんに貢献したいエンジニアを募集中です！！
デザミス株式会社では一緒にU-motionを作ってくれるエンジニアを募集中です。
• フロントエンドエンジニア
React, Vue.js等のフレームワークを用いた開発および運用の経験がある方
• バックエンドエンジニア
RDBMSの基礎知識とRuby on Railsを用いた開発および運用の経験がある方
• IoT エンジニア
OSとネットワークの十分な知識とGo, C, Python等を用いた開発経験がある方
• データエンジニア
統計の基礎知識とPandas, NumPy, scikit-learn等を用いた分析経験がある方
ご興味がありましたら、カジュアル面接からでも可能ですので、希望を添えてお気軽にご応募ください！
現在全部のステップをオンラインで実施しており、地方からでも参加可能です。エンジニア一同お待ちしております🐮