From 5e0ff5f966fa1bb2bf2d4a46fe6b8c80faf5bc87 Mon Sep 17 00:00:00 2001 From: Sebastian Markbage Date: Tue, 7 Jun 2016 18:36:04 -0700 Subject: [PATCH] Add Priority Levels Enum This flag on fibers will be used to track what priority of work is needed by that subtree, if any at all. Also fix up the TypeOfWork to have consistent naming and typing. --- src/renderers/shared/fiber/ReactFiber.js | 15 +++++++----- .../shared/fiber/ReactFiberBeginWork.js | 4 ++-- .../shared/fiber/ReactFiberCompleteWork.js | 4 ++-- .../shared/fiber/ReactPriorityLevel.js | 24 +++++++++++++++++++ ...ReactTypesOfWork.js => ReactTypeOfWork.js} | 8 +++---- 5 files changed, 41 insertions(+), 14 deletions(-) create mode 100644 src/renderers/shared/fiber/ReactPriorityLevel.js rename src/renderers/shared/fiber/{ReactTypesOfWork.js => ReactTypeOfWork.js} (84%) diff --git a/src/renderers/shared/fiber/ReactFiber.js b/src/renderers/shared/fiber/ReactFiber.js index 86e5cbaed1..9961d7a1bc 100644 --- a/src/renderers/shared/fiber/ReactFiber.js +++ b/src/renderers/shared/fiber/ReactFiber.js @@ -12,14 +12,17 @@ 'use strict'; -var ReactTypesOfWork = require('ReactTypesOfWork'); +import type { TypeOfWork } from 'ReactTypeOfWork'; +import type { PriorityLevel } from 'ReactPriorityLevel'; + +var ReactTypeOfWork = require('ReactTypeOfWork'); var { IndeterminateComponent, ClassComponent, HostComponent, CoroutineComponent, YieldComponent, -} = ReactTypesOfWork; +} = ReactTypeOfWork; var ReactElement = require('ReactElement'); @@ -32,7 +35,7 @@ import type { ReactCoroutine, ReactYield } from 'ReactCoroutine'; type Instance = { // Tag identifying the type of fiber. - tag: number, + tag: TypeOfWork, // The parent Fiber used to create this one. The type is constrained to the // Instance part of the Fiber since it is not safe to traverse the tree from @@ -71,7 +74,7 @@ export type Fiber = Instance & { output: any, // This type will be more specific once we overload the tag. // This will be used to quickly determine if a subtree has no pending changes. - hasPendingChanges: bool, + pendingWorkPriority: PriorityLevel, // This is a pooled version of a Fiber. Every fiber that gets updated will // eventually have a pair. There are cases when we can clean up pairs to save @@ -80,7 +83,7 @@ export type Fiber = Instance & { }; -var createFiber = function(tag : number, key : null | string) : Fiber { +var createFiber = function(tag : TypeOfWork, key : null | string) : Fiber { return { // Instance @@ -106,7 +109,7 @@ var createFiber = function(tag : number, key : null | string) : Fiber { memoizedInput: null, output: null, - hasPendingChanges: true, + pendingWorkPriority: 0, alternate: null, diff --git a/src/renderers/shared/fiber/ReactFiberBeginWork.js b/src/renderers/shared/fiber/ReactFiberBeginWork.js index 24ec08db90..0035d37e25 100644 --- a/src/renderers/shared/fiber/ReactFiberBeginWork.js +++ b/src/renderers/shared/fiber/ReactFiberBeginWork.js @@ -16,7 +16,7 @@ import type { ReactCoroutine } from 'ReactCoroutine'; import type { Fiber } from 'ReactFiber'; var ReactChildFiber = require('ReactChildFiber'); -var ReactTypesOfWork = require('ReactTypesOfWork'); +var ReactTypeOfWork = require('ReactTypeOfWork'); var { IndeterminateComponent, FunctionalComponent, @@ -25,7 +25,7 @@ var { CoroutineComponent, CoroutineHandlerPhase, YieldComponent, -} = ReactTypesOfWork; +} = ReactTypeOfWork; function reconcileChildren(current, workInProgress, nextChildren) { workInProgress.child = ReactChildFiber.reconcileChildFibers( diff --git a/src/renderers/shared/fiber/ReactFiberCompleteWork.js b/src/renderers/shared/fiber/ReactFiberCompleteWork.js index 179e050848..052331cb2e 100644 --- a/src/renderers/shared/fiber/ReactFiberCompleteWork.js +++ b/src/renderers/shared/fiber/ReactFiberCompleteWork.js @@ -18,7 +18,7 @@ import type { Fiber } from 'ReactFiber'; import type { ReifiedYield } from 'ReactReifiedYield'; var ReactChildFiber = require('ReactChildFiber'); -var ReactTypesOfWork = require('ReactTypesOfWork'); +var ReactTypeOfWork = require('ReactTypeOfWork'); var { IndeterminateComponent, FunctionalComponent, @@ -27,7 +27,7 @@ var { CoroutineComponent, CoroutineHandlerPhase, YieldComponent, -} = ReactTypesOfWork; +} = ReactTypeOfWork; function transferOutput(child : ?Fiber, parent : Fiber) { // If we have a single result, we just pass that through as the output to diff --git a/src/renderers/shared/fiber/ReactPriorityLevel.js b/src/renderers/shared/fiber/ReactPriorityLevel.js new file mode 100644 index 0000000000..b6930c2900 --- /dev/null +++ b/src/renderers/shared/fiber/ReactPriorityLevel.js @@ -0,0 +1,24 @@ +/** + * Copyright 2013-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + * + * @providesModule ReactPriorityLevel + * @flow + */ + +'use strict'; + +export type PriorityLevel = 0 | 1 | 2 | 3 | 4 | 5; + +module.exports = { + NoWork: 0, // No work is pending. + SynchronousPriority: 1, // For controlled text inputs. Synchronous side-effects. + AnimationPriority: 2, // Needs to complete before the next frame. + HighPriority: 3, // Interaction that needs to complete pretty soon to feel responsive. + LowPriority: 4, // Data fetching, or result from updating stores. + OffscreenPriority: 5, // Won't be visible but do the work in case it becomes visible. +}; diff --git a/src/renderers/shared/fiber/ReactTypesOfWork.js b/src/renderers/shared/fiber/ReactTypeOfWork.js similarity index 84% rename from src/renderers/shared/fiber/ReactTypesOfWork.js rename to src/renderers/shared/fiber/ReactTypeOfWork.js index d54dc16807..915084416f 100644 --- a/src/renderers/shared/fiber/ReactTypesOfWork.js +++ b/src/renderers/shared/fiber/ReactTypeOfWork.js @@ -6,13 +6,15 @@ * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * - * @providesModule ReactTypesOfWork + * @providesModule ReactTypeOfWork * @flow */ 'use strict'; -var TypesOfWork = { +export type TypeOfWork = 0 | 1 | 2 | 3 | 4 | 5 | 6; + +module.exports = { IndeterminateComponent: 0, // Before we know whether it is functional or class FunctionalComponent: 1, ClassComponent: 2, @@ -21,5 +23,3 @@ var TypesOfWork = { CoroutineHandlerPhase: 5, YieldComponent: 6, }; - -module.exports = TypesOfWork;