Yet another terrible title by me, but one that should answer the basic question of "what is the order in which component lifecycle methods get fired off?" or "What is workflow of the React"?
The original docs for Component Specs and Lifecycle are here: http://facebook.github.io/react/docs/component-specs.html
But this documentation doesn't necessarily put things in chronological ordering. I made a very basic "test" for demonstrating the lifecycle of components using console.log()'s.
Results first! (that's what people care about, anyway)
Results
React.renderComponent
- getDefaultProps
- getInitialState
- componentWillMount
- render
- componentDidMount
MyComponent.setProps
- componentWillReceiveProps
- shouldComponentUpdate
- componentWillUpdate
- render
- componentDidUpdate
React.unmountComponentAtNode
- componentWillUnmount
Methods
Not much to be said here, the component lifecycle methods were just crammed with console.log()'s.
You can review this code on JSFiddle or Github
Conclusion
ReactJS Component Lifecycle is really cool, but people can't be bothered to read documentation sometimes -- and who can blame them? The docs force you to slow down and think about your lifecycle when all you want to do is write some chronological code. At least this will be yet another source of information about this issue.
I hope this reduces the number of people asking about this on IRC and elsewhere on the internet.