07 2021 档案

初窥React-13 (render-3 differ算法)
摘要：先转一张图,介绍differ算法： differ遵循的原则: 只对同级比较，跨层级的dom不会进行复用 不同类型节点生成的dom树不同，此时会直接销毁老节点及子孙节点，并新建节点 可以通过key来对元素diff的过程提供复用的线索 reconcileChildFibers这个方法会根据newChil 阅读全文
posted @ 2021-07-20 12:04 AllenLiu0927 阅读(129) 评论(0) 推荐(0)
初窥React-12 (render-2)
摘要：继续看performUnitWork中的方法，看到completeUnitOfWork(unitOfWork)，总体看这是一个向上return的过程，尝试完成当前单元工作，然后指向下一个sibling,如果没有siblings，则返回到parent.这个方法中重要的方法是completeWork. 阅读全文
posted @ 2021-07-20 11:13 AllenLiu0927 阅读(67) 评论(0) 推荐(0)
初窥React-11 (render-1)
摘要：performSyncWorkOnRoot中有一个非常重要的方法 exitStatus = renderRootSync(root, lanes),继续深入，这里的workLoopSync是关键 function renderRootSync(root, lanes) { var prevExecu 阅读全文
posted @ 2021-07-19 21:45 AllenLiu0927 阅读(84) 评论(0) 推荐(0)
初窥React-10 (render引)
摘要：浏览performSyncWorkOnRoot 方法,根据不同情况进行渲染，这里是workInProgress和没有开始的 if (root workInProgressRoot && includesSomeLane(root.expiredLanes, workInProgressRootRen 阅读全文
posted @ 2021-07-19 20:29 AllenLiu0927 阅读(42) 评论(0) 推荐(0)
初窥React-9 (scheduleUpdateOnFiber方法-2)
摘要：ensureRootIsScheduled(root, eventTime)中跟scheduler相关的主要方法可以看scheduleSyncCallback(）或者scheduleCallback（）,参数是performSyncWorkOnRoot Fn,继续dive，可以看到其实它们都是调用了 阅读全文
posted @ 2021-07-12 22:58 AllenLiu0927 阅读(220) 评论(0) 推荐(0)
初窥React-8 (scheduleUpdateOnFiber方法-1)
摘要：// Register pending interactions on the root to avoid losing traced interaction data. schedulePendingInteractions(root, lane); scheduleInteractions 会利 阅读全文
posted @ 2021-07-11 14:26 AllenLiu0927 阅读(332) 评论(0) 推荐(0)
初窥React-7(updateContainer方法-p2)
摘要：来到了update入栈了 enqueueUpdate(current$1, update); function enqueueUpdate(fiber, update) { var updateQueue = fiber.updateQueue; //取出当前的updateQueue if (upd 阅读全文
posted @ 2021-07-08 23:27 AllenLiu0927 阅读(177) 评论(0) 推荐(0)
初窥React-5(unbatchedUpdate方法)
摘要：React按照事件的紧急程度，把它们划分成三个等级： 离散事件（DiscreteEvent）：click、keydown、focusin等，这些事件的触发不是连续的，优先级为0。 用户阻塞事件（UserBlockingEvent）：drag、scroll、mouseover等，特点是连续触发，阻塞渲 阅读全文
posted @ 2021-07-07 00:00 AllenLiu0927 阅读(164) 评论(0) 推荐(0)