react源码层分析协调与调度_React_

// packages/react-reconciler/src/ReactFiberWorkLoop.old.js export function requestEventTime() { if ((executionContext & (RenderContext | CommitContext)) !== NoContext) { // We're inside React, so it's fine to read the actual time. // react事件正在执行 // executionContext // RenderContext 正在计算 // CommitContext 正在提交 // export const NoContext = /* */ 0b0000000; // const BatchedContext = /* */ 0b0000001; // const EventContext = /* */ 0b0000010; // const DiscreteEventContext = /* */ 0b0000100; // const LegacyUnbatchedContext = /* */ 0b0001000; // const RenderContext = /* */ 0b0010000; // const CommitContext = /* */ 0b0100000; // export const RetryAfterError = /* */ 0b1000000; return now(); } // 没有在react事件执行 NoTimestamp === -1 if (currentEventTime !== NoTimestamp) { // 浏览器事件正在执行，返回上次的 currentEventTime return currentEventTime; } // 重新计算currentEventTime，当执行被中断后 currentEventTime = now(); return currentEventTime; }

export const now = initialTimeMs < 10000 ? Scheduler_now : () => Scheduler_now() - initialTimeMs;

// packages/react-reconciler/src/ReactFiberWorkLoop.old.js export function requestUpdateLane(fiber: Fiber): Lane { // Special cases const mode = fiber.mode; if ((mode & BlockingMode) === NoMode) { return (SyncLane: Lane); } else if ((mode & ConcurrentMode) === NoMode) { return getCurrentPriorityLevel() === ImmediateSchedulerPriority ? (SyncLane: Lane) : (SyncBatchedLane: Lane); } else if ( !deferRenderPhaseUpdateToNextBatch && (executionContext & RenderContext) !== NoContext && workInProgressRootRenderLanes !== NoLanes ) { // This is a render phase update. These are not officially supported. The // old behavior is to give this the same "thread" (expiration time) as // whatever is currently rendering. So if you call `setState` on a component // that happens later in the same render, it will flush. Ideally, we want to // remove the special case and treat them as if they came from an // interleaved event. Regardless, this pattern is not officially supported. // This behavior is only a fallback. The flag only exists until we can roll // out the setState warning, since existing code might accidentally rely on // the current behavior. return pickArbitraryLane(workInProgressRootRenderLanes); } // The algorithm for assigning an update to a lane should be stable for all // updates at the same priority within the same event. To do this, the inputs // to the algorithm must be the same. For example, we use the `renderLanes` // to avoid choosing a lane that is already in the middle of rendering. // // However, the "included" lanes could be mutated in between updates in the // same event, like if you perform an update inside `flushSync`. Or any other // code path that might call `prepareFreshStack`. // // The trick we use is to cache the first of each of these inputs within an // event. Then reset the cached values once we can be sure the event is over. // Our heuristic for that is whenever we enter a concurrent work loop. // // We'll do the same for `currentEventPendingLanes` below. if (currentEventWipLanes === NoLanes) { currentEventWipLanes = workInProgressRootIncludedLanes; } const isTransition = requestCurrentTransition() !== NoTransition; if (isTransition) { if (currentEventPendingLanes !== NoLanes) { currentEventPendingLanes = mostRecentlyUpdatedRoot !== null ? mostRecentlyUpdatedRoot.pendingLanes : NoLanes; } return findTransitionLane(currentEventWipLanes, currentEventPendingLanes); } // TODO: Remove this dependency on the Scheduler priority. // To do that, we're replacing it with an update lane priority. // 获取执行任务的优先级，便于调度 const schedulerPriority = getCurrentPriorityLevel(); // The old behavior was using the priority level of the Scheduler. // This couples React to the Scheduler internals, so we're replacing it // with the currentUpdateLanePriority above. As an example of how this // could be problematic, if we're not inside `Scheduler.runWithPriority`, // then we'll get the priority of the current running Scheduler task, // which is probably not what we want. let lane; if ( // TODO: Temporary. We're removing the concept of discrete updates. (executionContext & DiscreteEventContext) !== NoContext && // 用户block的类型事件 schedulerPriority === UserBlockingSchedulerPriority ) { // 通过findUpdateLane函数重新计算lane lane = findUpdateLane(InputDiscreteLanePriority, currentEventWipLanes); } else { // 根据优先级计算法则计算lane const schedulerLanePriority = schedulerPriorityToLanePriority( schedulerPriority, ); if (decoupleUpdatePriorityFromScheduler) { // In the new strategy, we will track the current update lane priority // inside React and use that priority to select a lane for this update. // For now, we're just logging when they're different so we can assess. const currentUpdateLanePriority = getCurrentUpdateLanePriority(); if ( schedulerLanePriority !== currentUpdateLanePriority && currentUpdateLanePriority !== NoLanePriority ) { if (__DEV__) { console.error( 'Expected current scheduler lane priority %s to match current update lane priority %s', schedulerLanePriority, currentUpdateLanePriority, ); } } } // 根据计算得到的 schedulerLanePriority，计算更新的优先级 lane lane = findUpdateLane(schedulerLanePriority, currentEventWipLanes); } return lane; }

export function findUpdateLane( lanePriority: LanePriority, wipLanes: Lanes, ): Lane { switch (lanePriority) { case NoLanePriority: break; case SyncLanePriority: return SyncLane; case SyncBatchedLanePriority: return SyncBatchedLane; case InputDiscreteLanePriority: { const lane = pickArbitraryLane(InputDiscreteLanes & ~wipLanes); if (lane === NoLane) { // Shift to the next priority level return findUpdateLane(InputContinuousLanePriority, wipLanes); } return lane; } case InputContinuousLanePriority: { const lane = pickArbitraryLane(InputContinuousLanes & ~wipLanes); if (lane === NoLane) { // Shift to the next priority level return findUpdateLane(DefaultLanePriority, wipLanes); } return lane; } case DefaultLanePriority: { let lane = pickArbitraryLane(DefaultLanes & ~wipLanes); if (lane === NoLane) { // If all the default lanes are already being worked on, look for a // lane in the transition range. lane = pickArbitraryLane(TransitionLanes & ~wipLanes); if (lane === NoLane) { // All the transition lanes are taken, too. This should be very // rare, but as a last resort, pick a default lane. This will have // the effect of interrupting the current work-in-progress render. lane = pickArbitraryLane(DefaultLanes); } } return lane; } case TransitionPriority: // Should be handled by findTransitionLane instead case RetryLanePriority: // Should be handled by findRetryLane instead break; case IdleLanePriority: let lane = pickArbitraryLane(IdleLanes & ~wipLanes); if (lane === NoLane) { lane = pickArbitraryLane(IdleLanes); } return lane; default: // The remaining priorities are not valid for updates break; } invariant( false, 'Invalid update priority: %s. This is a bug in React.', lanePriority, ); }

export opaque type LanePriority = | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17; export opaque type Lanes = number; export opaque type Lane = number; export opaque type LaneMap = Array; import { ImmediatePriority as ImmediateSchedulerPriority, UserBlockingPriority as UserBlockingSchedulerPriority, NormalPriority as NormalSchedulerPriority, LowPriority as LowSchedulerPriority, IdlePriority as IdleSchedulerPriority, NoPriority as NoSchedulerPriority, } from './SchedulerWithReactIntegration.new'; // 同步任务 export const SyncLanePriority: La
                
提示：
                    本文由神整理自网络，如有侵权请联系本站删除！
                    

                    本站声明： 

                    1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持； 

                    2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！
                
                

                

                                            
上一篇：Node.js中http模块和导出共享问题_node.js_
                                                                
下一篇：react组件的创建与更新实现流程详解_React_