ReactNavigation: How do avoid screen re-rendering when not visible

Question

I notice the all the screens are being re-rendered as I navigate through the app even though they are not active(visible). The only exception are the screens in TabNavigator with LazyLoad set to true. If yes, how do I suppress the rendering i and trigger the render only when visible

Answer 1

You should use shouldComponentUpdate to check data from redux to decide if you need re-rendering your component. It uses the same api in react. You can check here: https://facebook.github.io/react/docs/react-component.html#shouldcomponentupdate