Why does set state always start the work from root again
hskrishandi opened this issue · comments
Awesome blog post! It has been the best guide that I've ever read and really helped me understand the internals of React Fiber architecture.
One thing that I notice is that inside the useState
, the setState
will always set nextUnitOfWork = wipRoot
, which means Didact will reconcile from the root. And inside updateFunctionComponent
, the function component will always call fiber.type(fiber.props)
which will cause the component re-render. But I believe this is not the case in React?
For example, we have this structure: https://playcode.io/1603467
<Parent>
<Children />
</Parent>
const Parent = ({ children }) => {
console.log('parent re-render')
return <div>{children}</div>
}
const Children = (props) => {
const [state, setState] = useState(0);
console.log('child re-render')
return <button onClick={() => setState(state+1)}>Click</button>
}
In actual React, when the <Children>
button is clicked and setState
is invoked, the <Parent>
component will not-rerender. It is reflected by the parent console.log
, which doesn't run again.
So my question is, how does Didact differ from React in this case? Which React's feature is not implemented in Didact?
Thanks