This is the post-mortem report about the performance problems found mostly in Android but also, in a lesser extend in iOS.
This has a huge impact in the performance. By my measures, about 4x times faster. So be sure to that the app is in production mode before reporting any performance issues.
SVGs are really slow compared to other components. They can take up to 90ms to render so be careful with them.
One technique that helped us a lot is delaying the rendering of SVGs in Forms until the Router Transitions are done.
We have a new reusable High Order Component to do that: providePartialRender.
The delay improves a lot the initial rendering performance and also improves a lot the Router Transition.
Router transitions are very performance critical. In the experiments I've made, you should not do anything in JS until that transition is done. Try to reduce the amount of Scene Rendering to 1 until the transition is done. Also, any Redux state change might impact the transition performance.
The important part is that transitions are made in Javascript, so they are very performance intensive, so don't do anything else (much less rendering stuff) while that's happening.
One particular case (Edit My Account) that threw the performance of the transition of the charts was the fact that we were
doing some initial data fetching on componentDidMount, and that data fetching in turn changed the App State, and since
on every App state change redux re-renders the component the result was that the Scene Component (Profile.tsx) was rendering
a couple of times while the Router transition was being shown, and that impacted severely to the performance of
the transition.
console.log has a very unexpected impact to performance, that's why we are disabling redux-logger on production builds.
If you are experiencing performance problems (on transitions for example) be sure to check the console and see if we are
logging a lot of stuff, which is bad!