Twitter | Search | |
Dan Abramov
I just made this diagram of modern React lifecycle methods. Hope you’ll find it helpful!
Reply Retweet Like More
Dan Abramov 4 Apr 18
Replying to @dan_abramov
This might provide some visual insight into the purpose of new lifecycles in 16.3 (as well as why some lifecycles became legacy). We can’t put componentWillMount/Update/ReceiveProps into either render or commit “phase” without violating existing assumptions.
Reply Retweet Like
Dan Abramov 4 Apr 18
Replying to @dan_abramov
The separation between two render and commit phases is exactly what makes async rendering possible. Anything in the “render phase” is safe to throw away, suspend, or restart from scratch—because it’s pure!
Reply Retweet Like
Dan Abramov 18 Jul 18
Replying to @dan_abramov
Note: this version is more accurate as of 16.4
Reply Retweet Like
Troy Rhinehart 6 Apr 18
Replying to @dan_abramov
I love having `getDerivedStateFromProps` fire before/after mounting, but why is it static? How can I trigger async logic (dynamic lazy loading via prop) when I can't access `this.setState` or `this.forceUpdate` anymore?
Reply Retweet Like
Dan Abramov 6 Apr 18
Replying to @_gingur
It’s not a good place for side effects (which is why it’s static), use componentDidUpdate instead.
Reply Retweet Like
Manuel Bieh 🐝 10 May 18
Replying to @dan_abramov
Hey Dan, I don't find any license information here. Is that image "free to use"? Also commercially? Would mention you, of course.
Reply Retweet Like
Dan Abramov 10 May 18
Replying to @ManuelBieh
CC0, do whatever
Reply Retweet Like
Kent C. Dodds 🚀 5 Apr 18
Replying to @dan_abramov
This is amazingly helpful Dan! Thank you! Question by way of clarification. Is this oversimplifying things a tad? Based on this I assumed that react doesn't actually update the DOM until after it checks for setState calls in cDM and cDU.
Reply Retweet Like
Dan Abramov 5 Apr 18
Replying to @kentcdodds
If that were the case then you wouldn’t be able to measure *updated* DOM 🙂 React does update the DOM but since it doesn’t yield to the browser yet, nothing is painted until further setStates are processed
Reply Retweet Like
Vitalii Akimov 4 Apr 18
Replying to @dan_abramov
where to request async markup? like before first render returning null was considered performance problem, is it ok now? is it componentDidMount?
Reply Retweet Like
Dan Abramov 5 Apr 18
Replying to @vitalii_akimov
I’m not sure what you mean by markup but you can do AJAX requests in componentDidMount
Reply Retweet Like