1. Update the beginWork process

The CreateWokingProgress reconcilechildren reconcilechildren is not updated when the CreateWokingProgress reconcilechildren is at root. Will go bailoutOnAlreadyFinishedWork, it returns the child as a child to recursive implementation beginwork rootFiber.

2. When the beginWork is implemented in the App, the update will be determined by comparing the information such as props. (Note that only children of the native DOM are placed in the props. Function components are diff by comparing JSX to CurrentChild), go through the updateFunctionCmp process, execute RenderHooks to get the JSX into the reconcileChildren as NextChildren, Compare subcurrent and JSX to see if it can be reused. If it can be reused, fiber will be returned as app. child, where side EffectTag is true and placement/delete tag may be added

2. The completeWork process in the update phase

1. The DOM node is no longer the creation node. It is now the updateHostComponent function, which diff all the attributes

All attributes written on the element tag include children but children must be text to be effective. For example, div children is an array containing two objects. Although p changes internally, div children does not detect objects and only the text is affected by update

<div>
	<p title = {number}>{{number}}</p>
	<button onClick={()=>{}}></button>
</div>
Copy the code

For example, in the following diff property, the title and children of the P tag go into the diff and the last update ue is [title,2,children,2]

Fiber of p with update and Button onClick= anonymous function changes every time, so fiber of Button with update, but no update value, finally at the top, The effect chain is p->button and the completeWork is executed first

Dom fiber’s updateQueue is updated with changes in the properties and values of the class component and the state of the function component