Part 13
13.0 Part 13 (clickable)
Receive component (next element, to be more precise)
Well, through ReactReconciler.receiveComponent React actually calls receiveComponent from ReactDOMComponent and pass next element there. Reassign it on DOM component instance and call update method. updateComponent method actually performs two main actions: update DOM properties and DOM children, based on prev and next props. Good for us, we already analyzed _updateDOMProperties (src\renderers\dom\shared\ReactDOMComponent.js#946) method. As you remember, this method mostly process HTML elements properties and attributes, compute styles, handle event listeners etc. What is left, it’s _updateDOMChildren (src\renderers\dom\shared\ReactDOMComponent.js#1076).
Alright, we’ve finished Part 13. That was a short one.)
Let’s recap how we got here. Let’s look at the scheme one more time, then remove redundant less important pieces, and it becomes this:
13.1 Part 13 simplified (clickable)
And we should probably fix spaces and alignment as well:
13.2 Part 13 simplified & refactored (clickable)
Nice. In fact, that’s all that happens here. So, we can take the essential value from Part 13 and use it for the final updating scheme:
13.3 Part 13 essential value (clickable)
And then we’re done!