Closed Syaw0 closed 1 year ago
i check this code and i think we need to set condition for when old Fiber is null this mean we are in first render!
https://github.com/pomber/didact/blob/fa79b34d8060bb00869d6b4f3a3eb84da33aef01/didact.js#L252 https://github.com/pomber/didact/blob/fa79b34d8060bb00869d6b4f3a3eb84da33aef01/didact.js#L153 https://github.com/pomber/didact/blob/fa79b34d8060bb00869d6b4f3a3eb84da33aef01/didact.js#L146
we just rewrite a reconciler function
const reconcileChildren = ( fiber:Fiber, children:(PreactElement|PreactTextElement)[] ) => { let oldFiber = fiber.alternate && fiber.alternate.child let prevSibling:Fiber|null = null children.forEach((el,index)=>{ let newFiber:Fiber|null = null if(oldFiber != null){ const sameType = oldFiber && el && el.type === oldFiber.type if(sameType){ // in this condition element and oldFiber is exist and // both types are equal maybe props are changed newFiber = { type:oldFiber.type, props:el.props, // assign new props dom:oldFiber.dom, parent:fiber, alternate:oldFiber, effectTag:"UPDATE", child:null, sibling:null } } if(el && !sameType ){ newFiber = { type:el.type, props:el.props, dom:null, parent:fiber, alternate:null, effectTag:"PLACEMENT", child:null, sibling:null } } if(oldFiber && !sameType){ oldFiber.effectTag = "DELETION" deletion.push(oldFiber) } if(oldFiber){ oldFiber = oldFiber.sibling newFiber = { type:el.type, props:el.props, dom:null, parent:fiber, alternate:null, child:null, sibling:null } } if (index === 0){ fiber.child = newFiber }else{ if(prevSibling){ prevSibling.sibling = newFiber } } prevSibling = newFiber }else{ // create a first render dom newFiber = { type:el.type, props:el.props, parent:fiber, dom:null, child:null, sibling:null, alternate:null } newFiber.alternate = newFiber if (index === 0){ fiber.child = newFiber }else{ if(prevSibling){ prevSibling.sibling = newFiber } } prevSibling = newFiber return } }) }
if i wrong please tell me :)
i check this code and i think we need to set condition for when old Fiber is null this mean we are in first render!
https://github.com/pomber/didact/blob/fa79b34d8060bb00869d6b4f3a3eb84da33aef01/didact.js#L252 https://github.com/pomber/didact/blob/fa79b34d8060bb00869d6b4f3a3eb84da33aef01/didact.js#L153 https://github.com/pomber/didact/blob/fa79b34d8060bb00869d6b4f3a3eb84da33aef01/didact.js#L146
Solution
we just rewrite a reconciler function
if i wrong please tell me :)