CODEWITHSUNDEEP
react-native
devedv
devedv

Reputation: 622

Performance monitor react native

I'm noticing the "dropped so far" number in the perf monitor constantly increasing up. It reached 2030fps.

Is this number supposed to increase constantly? or I have something wrong in my app.

Upvotes: 1

Views: 1225

Answers (1)

Robbie Milejczak
Robbie Milejczak

Reputation: 5780

It will generally increase over time but you want that number to be as low as possible. Basically every javascript action is bundled within 16ms intervals and sent to the main thread, anytime a javascript action takes longer than that it's considered a dropped frame because the main thread no has to wait for the next 16ms batch. Every 16ms results in 1 more dropped frame.

So for example say you have a component that has a slide in animation, and does some work on componentDidMount and that works takes 60ms. That means that if your animation is happening on the javascript thread it will stutter for 4 frames (which is definitely perceptible).

Go through your app and see which renders cause the app to drop frames, then check out the render logic for those components. It's likely that you should be using shouldComponentUpdate or even better PureComponent to prevent wasted renders.

More info here!

Upvotes: 1

Related Questions