私たちのreact-nativeアプリがうまく機能していることを知る良い方法はありますか？
私がそこにある知っているが、perf monitor私は有効にするとPerf Monitor、ここで私は、彼らが何を意味するか知らないいくつかのオプションがあります。
150 dropped so far
お気に入り： 12 stutters (4+) so far
そして最後にfps、react-nativeの自己とは何ですか？
FPSは「1秒あたりのフレーム数」を意味します。「スムーズな」アプリは、ほとんどの場合60fpsで実行する必要があります。最近のほとんどの電話には60Hzのディスプレイがあり（つまり、1秒間に60回しか更新されない）、したがって、ハイエンドの電話だけが1秒間に60フレーム以上を表示できます。RNアプリが最適な速度で実行されていることを確認するためにできることがいくつかあります。
すでにご存知かもしれませんが、「ブリッジ」（Javascript-> Native）を通過するのは遅く、スタッター/低FPSを引き起こします。この橋がどのように機能するかを詳細に説明している資料がたくさんあるので、それについてはあまり話しません。画面の遷移またはアニメーション中に実行される作業（特にブリッジクロス）の量を最小限に抑えるようにしてください。これは、InteractionManagerAPIを使用して行うことができます。詳しくはこちらをご覧ください。
パフォーマンスに関する公式ドキュメントを読むことを忘れないでください。
新しい画面を開いた直後に遅延に気付いた場合は、画面が完全にビューポートに移行するまでレンダリングを延期してみてください。これを行う方法の例：
import { View, InteractionManager } from 'react-native';
class Example extends Component {
constructor(props) {
super(props);
this.state = { ready: false };
}
componentDidMount() {
// After all interactions have been finished we swich the "ready" state variable to true, and only then your component will be rendered.
InteractionManager.runAfterInteractions(() => {
this.setState({ ready: true });
})
}
render() {
if (!this.state.ready) {
return;
}
// Render only when this.state.ready is true (after all interactions have been finalised);
return (
<View></View>
);
}
}この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加