Menu
I profiled the performance of my application using react redux by following this article by Ben Schwarz.
In the user timing section, i get these warnings (with a no entry sign):
There is two messages:
(Committing Changes) Warning: Lifecycle hook scheduled a cascading updateConnect(MyComponent).componentDidUpdate Warning: Scheduled a cascading update I made some search but i found nothing special. It seems related to the componentDidUpdate function of the connect HOC of react-redux.
What does these messages means ?
421
The componentDidUpdate is a part of a React component life cycle. We use it to react to external changes in component's props or internal state changes. With the componentDidUpdate you can modify the underlying DOM nodes, request remote data, and update the internal state of your component.
You may call setState() immediately in componentDidUpdate() but note that it must be wrapped in a condition like in the example above, or you'll cause an infinite loop. It would also cause an extra re-rendering which, while not visible to the user, can affect the component performance.
The componentDidUpdate method is called after the render method of the component is done executing. That means that it will be called after all children's render methods have finished. This is implied in the documentation you linked: Use this as an opportunity to operate on the DOM when the component has been updated.
The componentDidUpdate()is called after componentDidMount() and can be useful to perform some action when the state of the component changes. Parameters: Following are the parameter used in this function: prevProps: Previous props passed to the component. prevState: Previous state of the component.
The messages mean that componentDidUpdate is getting changed props or setting the state and so the update will cascade (happen right after the last update) because it is the last lifecycle method called during an update. Basically React has determined that another update needs to happen and it isn't even finished with it's current update yet. I'm not sure if this is a problem with react-redux or your application.
103
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
