ReactNativeのパフォーマンスを計測する
3回ほどテストを繰り返し、スプレッドシートに記録
起動時間などはビルドのリリースバリエーションを使用する
リリースビルドする
実機で計測すること
シミュレータ上の方が楽だが、CPUのばらつきが大きすぎるため、適切に結果を比較できない
計測方法の問題でシミューレータ上でしか計測できない場合でも本番モードにすること
開発モードでは、redux-loggerなどが動いているのでばらつく
__DEV__ === false, development-level warning are OFF, performance optimizations are ON
サポートする範囲で最も遅いデバイスを使用する
パフォーマンスの差が明確になり、良い
小さい最適化を行う場合はビデオキャプチャを使用して並べて設定する
流れとしてはこんなかんじなのだろうかmrsekut.icon
本番環境の実機で手動で触ってみて体感として重いところを特定する
その操作周りを計測する
何かしらの改善をする
再び計測する
つまり、「全体を計測してボトルネックを探す」とかはあまり現実的ではない
なぜなら、アプリは基本的にインタラクションありきなので、「全体」の定義が存在しない
なので最初の「手動で触ってみて」の作業が必要になる
最初は直感、体感に任す
体感で見るところのコツはあると思う
アプリ起動時
POST周り
取得するデータが多いところ
etc.
計測ツール
実機, Simulatorで使用可
Simulatorのみで使用可
other
以下が統合されたもの
The official Remote Debugger
React Inspector
Redux DevTools
レンダリングツリーの記録、各コンポーネントが描画された回数や時間を正確にグラフで示してくれる
本家
RNで使えるのか？mrsekut.icon
リアルタイムパフォーマンスモニター
起動時間の計測
eject必要かも
https://www.youtube.com/watch?v=OGsR3O4qu6s&t=5660s
Flipperを使えないので保留mrsekut.icon*2
ログを記録するツール
Flipperによって代替された？
ふるい
RN本家のMessageQueue
古い？