@samitouri / QOS-React-2 / commits / e9aa9592c1

change ReactBatchConfig.transition

Previously, ReactBatchConfig.transition was an number (1 = there is a transition, 0 = there isn't one). This PR changes this to a transition object (object = there is a transition, null = there isn't one) in preparation for transition tracing changes.

Luna Ruan committed Feb 17, 2022 at 16:13 UTC e9aa9592c10f604dde7bb31b73e58ec190f3b3dc
9 files changed +90 -51
packages/react-dom/src/events/ReactDOMEventListener.js
+2 -2
@@ -117,7 +117,7 @@ function dispatchDiscreteEvent(
117 ) {
118 const previousPriority = getCurrentUpdatePriority();
119 const prevTransition = ReactCurrentBatchConfig.transition;
120 - ReactCurrentBatchConfig.transition = 0;
120 + ReactCurrentBatchConfig.transition = null;
121 try {
122 setCurrentUpdatePriority(DiscreteEventPriority);
123 dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent);
@@ -135,7 +135,7 @@ function dispatchContinuousEvent(
135 ) {
136 const previousPriority = getCurrentUpdatePriority();
137 const prevTransition = ReactCurrentBatchConfig.transition;
138 - ReactCurrentBatchConfig.transition = 0;
138 + ReactCurrentBatchConfig.transition = null;
139 try {
140 setCurrentUpdatePriority(ContinuousEventPriority);
141 dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent);
packages/react-reconciler/src/ReactFiberHooks.new.js
+15 -8
@@ -1928,7 +1928,7 @@ function mountDeferredValue<T>(value: T): T {
1928 const [prevValue, setValue] = mountState(value);
1929 mountEffect(() => {
1930 const prevTransition = ReactCurrentBatchConfig.transition;
1931 - ReactCurrentBatchConfig.transition = 1;
1931 + ReactCurrentBatchConfig.transition = {};
1932 try {
1933 setValue(value);
1934 } finally {
@@ -1942,7 +1942,7 @@ function updateDeferredValue<T>(value: T): T {
1942 const [prevValue, setValue] = updateState(value);
1943 updateEffect(() => {
1944 const prevTransition = ReactCurrentBatchConfig.transition;
1945 - ReactCurrentBatchConfig.transition = 1;
1945 + ReactCurrentBatchConfig.transition = {};
1946 try {
1947 setValue(value);
1948 } finally {
@@ -1956,7 +1956,7 @@ function rerenderDeferredValue<T>(value: T): T {
1956 const [prevValue, setValue] = rerenderState(value);
1957 updateEffect(() => {
1958 const prevTransition = ReactCurrentBatchConfig.transition;
1959 - ReactCurrentBatchConfig.transition = 1;
1959 + ReactCurrentBatchConfig.transition = {};
1960 try {
1961 setValue(value);
1962 } finally {
@@ -1975,20 +1975,27 @@ function startTransition(setPending, callback) {
1975 setPending(true);
1976
1977 const prevTransition = ReactCurrentBatchConfig.transition;
1978 - ReactCurrentBatchConfig.transition = 1;
1978 + ReactCurrentBatchConfig.transition = {};
1979 + const currentTransition = ReactCurrentBatchConfig.transition;
1980 +
1981 + if (__DEV__) {
1982 + ReactCurrentBatchConfig.transition._updatedFibers = new Set();
1983 + }
1984 +
1985 try {
1986 setPending(false);
1987 callback();
1988 } finally {
1989 setCurrentUpdatePriority(previousPriority);
1990 +
1991 ReactCurrentBatchConfig.transition = prevTransition;
1992 if (__DEV__) {
1993 if (
1987 - prevTransition !== 1 &&
1994 + prevTransition === null &&
1995 warnOnSubscriptionInsideStartTransition &&
1989 - ReactCurrentBatchConfig._updatedFibers
1996 + currentTransition._updatedFibers
1997 ) {
1991 - const updatedFibersCount = ReactCurrentBatchConfig._updatedFibers.size;
1998 + const updatedFibersCount = currentTransition._updatedFibers.size;
1999 if (updatedFibersCount > 10) {
2000 console.warn(
2001 'Detected a large number of updates inside startTransition. ' +
@@ -1996,7 +2003,7 @@ function startTransition(setPending, callback) {
2003 'Otherwise concurrent mode guarantees are off the table.',
2004 );
2005 }
1999 - ReactCurrentBatchConfig._updatedFibers.clear();
2006 + currentTransition._updatedFibers.clear();
2007 }
2008 }
2009 }
packages/react-reconciler/src/ReactFiberHooks.old.js
+15 -8
@@ -1928,7 +1928,7 @@ function mountDeferredValue<T>(value: T): T {
1928 const [prevValue, setValue] = mountState(value);
1929 mountEffect(() => {
1930 const prevTransition = ReactCurrentBatchConfig.transition;
1931 - ReactCurrentBatchConfig.transition = 1;
1931 + ReactCurrentBatchConfig.transition = {};
1932 try {
1933 setValue(value);
1934 } finally {
@@ -1942,7 +1942,7 @@ function updateDeferredValue<T>(value: T): T {
1942 const [prevValue, setValue] = updateState(value);
1943 updateEffect(() => {
1944 const prevTransition = ReactCurrentBatchConfig.transition;
1945 - ReactCurrentBatchConfig.transition = 1;
1945 + ReactCurrentBatchConfig.transition = {};
1946 try {
1947 setValue(value);
1948 } finally {
@@ -1956,7 +1956,7 @@ function rerenderDeferredValue<T>(value: T): T {
1956 const [prevValue, setValue] = rerenderState(value);
1957 updateEffect(() => {
1958 const prevTransition = ReactCurrentBatchConfig.transition;
1959 - ReactCurrentBatchConfig.transition = 1;
1959 + ReactCurrentBatchConfig.transition = {};
1960 try {
1961 setValue(value);
1962 } finally {
@@ -1975,20 +1975,27 @@ function startTransition(setPending, callback) {
1975 setPending(true);
1976
1977 const prevTransition = ReactCurrentBatchConfig.transition;
1978 - ReactCurrentBatchConfig.transition = 1;
1978 + ReactCurrentBatchConfig.transition = {};
1979 + const currentTransition = ReactCurrentBatchConfig.transition;
1980 +
1981 + if (__DEV__) {
1982 + ReactCurrentBatchConfig.transition._updatedFibers = new Set();
1983 + }
1984 +
1985 try {
1986 setPending(false);
1987 callback();
1988 } finally {
1989 setCurrentUpdatePriority(previousPriority);
1990 +
1991 ReactCurrentBatchConfig.transition = prevTransition;
1992 if (__DEV__) {
1993 if (
1987 - prevTransition !== 1 &&
1994 + prevTransition === null &&
1995 warnOnSubscriptionInsideStartTransition &&
1989 - ReactCurrentBatchConfig._updatedFibers
1996 + currentTransition._updatedFibers
1997 ) {
1991 - const updatedFibersCount = ReactCurrentBatchConfig._updatedFibers.size;
1998 + const updatedFibersCount = currentTransition._updatedFibers.size;
1999 if (updatedFibersCount > 10) {
2000 console.warn(
2001 'Detected a large number of updates inside startTransition. ' +
@@ -1996,7 +2003,7 @@ function startTransition(setPending, callback) {
2003 'Otherwise concurrent mode guarantees are off the table.',
2004 );
2005 }
1999 - ReactCurrentBatchConfig._updatedFibers.clear();
2006 + currentTransition._updatedFibers.clear();
2007 }
2008 }
2009 }
packages/react-reconciler/src/ReactFiberTracingMarkerComponent.new.js new
+13
@@ -0,0 +1,13 @@
1 +/**
2 + * Copyright (c) Facebook, Inc. and its affiliates.
3 + *
4 + * This source code is licensed under the MIT license found in the
5 + * LICENSE file in the root directory of this source tree.
6 + *
7 + * @flow
8 + */
9 +import type {Fiber} from 'react-reconciler/src/ReactInternalTypes';
10 +
11 +export type Transition = {
12 + _updatedFibers?: Set<Fiber>,
13 +};
packages/react-reconciler/src/ReactFiberTransition.js
+3 -2
@@ -8,11 +8,12 @@
8 */
9
10 import ReactSharedInternals from 'shared/ReactSharedInternals';
11 +import type {Transition} from './ReactFiberTracingMarkerComponent.new';
12
13 const {ReactCurrentBatchConfig} = ReactSharedInternals;
14
14 -export const NoTransition = 0;
15 +export const NoTransition = null;
16
16 -export function requestCurrentTransition(): number {
17 +export function requestCurrentTransition(): Transition | null {
18 return ReactCurrentBatchConfig.transition;
19 }
packages/react-reconciler/src/ReactFiberWorkLoop.new.js
+14 -9
@@ -401,9 +401,14 @@ export function requestUpdateLane(fiber: Fiber): Lane {
401 if (
402 __DEV__ &&
403 warnOnSubscriptionInsideStartTransition &&
404 - ReactCurrentBatchConfig._updatedFibers
404 + ReactCurrentBatchConfig.transition !== null
405 ) {
406 - ReactCurrentBatchConfig._updatedFibers.add(fiber);
406 + const transition = ReactCurrentBatchConfig.transition;
407 + if (!transition._updatedFibers) {
408 + transition._updatedFibers = new Set();
409 + }
410 +
411 + transition._updatedFibers.add(fiber);
412 }
413 // The algorithm for assigning an update to a lane should be stable for all
414 // updates at the same priority within the same event. To do this, the
@@ -1246,7 +1251,7 @@ export function deferredUpdates<A>(fn: () => A): A {
1251 const previousPriority = getCurrentUpdatePriority();
1252 const prevTransition = ReactCurrentBatchConfig.transition;
1253 try {
1249 - ReactCurrentBatchConfig.transition = 0;
1254 + ReactCurrentBatchConfig.transition = null;
1255 setCurrentUpdatePriority(DefaultEventPriority);
1256 return fn();
1257 } finally {
@@ -1285,7 +1290,7 @@ export function discreteUpdates<A, B, C, D, R>(
1290 const previousPriority = getCurrentUpdatePriority();
1291 const prevTransition = ReactCurrentBatchConfig.transition;
1292 try {
1288 - ReactCurrentBatchConfig.transition = 0;
1293 + ReactCurrentBatchConfig.transition = null;
1294 setCurrentUpdatePriority(DiscreteEventPriority);
1295 return fn(a, b, c, d);
1296 } finally {
@@ -1320,7 +1325,7 @@ export function flushSync(fn) {
1325 const prevTransition = ReactCurrentBatchConfig.transition;
1326 const previousPriority = getCurrentUpdatePriority();
1327 try {
1323 - ReactCurrentBatchConfig.transition = 0;
1328 + ReactCurrentBatchConfig.transition = null;
1329 setCurrentUpdatePriority(DiscreteEventPriority);
1330 if (fn) {
1331 return fn();
@@ -1355,7 +1360,7 @@ export function flushControlled(fn: () => mixed): void {
1360 const prevTransition = ReactCurrentBatchConfig.transition;
1361 const previousPriority = getCurrentUpdatePriority();
1362 try {
1358 - ReactCurrentBatchConfig.transition = 0;
1363 + ReactCurrentBatchConfig.transition = null;
1364 setCurrentUpdatePriority(DiscreteEventPriority);
1365 fn();
1366 } finally {
@@ -1893,7 +1898,7 @@ function commitRoot(root: FiberRoot, recoverableErrors: null | Array<mixed>) {
1898 const previousUpdateLanePriority = getCurrentUpdatePriority();
1899 const prevTransition = ReactCurrentBatchConfig.transition;
1900 try {
1896 - ReactCurrentBatchConfig.transition = 0;
1901 + ReactCurrentBatchConfig.transition = null;
1902 setCurrentUpdatePriority(DiscreteEventPriority);
1903 commitRootImpl(root, recoverableErrors, previousUpdateLanePriority);
1904 } finally {
@@ -2028,7 +2033,7 @@ function commitRootImpl(
2033
2034 if (subtreeHasEffects || rootHasEffect) {
2035 const prevTransition = ReactCurrentBatchConfig.transition;
2031 - ReactCurrentBatchConfig.transition = 0;
2036 + ReactCurrentBatchConfig.transition = null;
2037 const previousPriority = getCurrentUpdatePriority();
2038 setCurrentUpdatePriority(DiscreteEventPriority);
2039
@@ -2283,7 +2288,7 @@ export function flushPassiveEffects(): boolean {
2288 const prevTransition = ReactCurrentBatchConfig.transition;
2289 const previousPriority = getCurrentUpdatePriority();
2290 try {
2286 - ReactCurrentBatchConfig.transition = 0;
2291 + ReactCurrentBatchConfig.transition = null;
2292 setCurrentUpdatePriority(priority);
2293 return flushPassiveEffectsImpl();
2294 } finally {
packages/react-reconciler/src/ReactFiberWorkLoop.old.js
+14 -9
@@ -401,9 +401,14 @@ export function requestUpdateLane(fiber: Fiber): Lane {
401 if (
402 __DEV__ &&
403 warnOnSubscriptionInsideStartTransition &&
404 - ReactCurrentBatchConfig._updatedFibers
404 + ReactCurrentBatchConfig.transition !== null
405 ) {
406 - ReactCurrentBatchConfig._updatedFibers.add(fiber);
406 + const transition = ReactCurrentBatchConfig.transition;
407 + if (!transition._updatedFibers) {
408 + transition._updatedFibers = new Set();
409 + }
410 +
411 + transition._updatedFibers.add(fiber);
412 }
413 // The algorithm for assigning an update to a lane should be stable for all
414 // updates at the same priority within the same event. To do this, the
@@ -1246,7 +1251,7 @@ export function deferredUpdates<A>(fn: () => A): A {
1251 const previousPriority = getCurrentUpdatePriority();
1252 const prevTransition = ReactCurrentBatchConfig.transition;
1253 try {
1249 - ReactCurrentBatchConfig.transition = 0;
1254 + ReactCurrentBatchConfig.transition = null;
1255 setCurrentUpdatePriority(DefaultEventPriority);
1256 return fn();
1257 } finally {
@@ -1285,7 +1290,7 @@ export function discreteUpdates<A, B, C, D, R>(
1290 const previousPriority = getCurrentUpdatePriority();
1291 const prevTransition = ReactCurrentBatchConfig.transition;
1292 try {
1288 - ReactCurrentBatchConfig.transition = 0;
1293 + ReactCurrentBatchConfig.transition = null;
1294 setCurrentUpdatePriority(DiscreteEventPriority);
1295 return fn(a, b, c, d);
1296 } finally {
@@ -1320,7 +1325,7 @@ export function flushSync(fn) {
1325 const prevTransition = ReactCurrentBatchConfig.transition;
1326 const previousPriority = getCurrentUpdatePriority();
1327 try {
1323 - ReactCurrentBatchConfig.transition = 0;
1328 + ReactCurrentBatchConfig.transition = null;
1329 setCurrentUpdatePriority(DiscreteEventPriority);
1330 if (fn) {
1331 return fn();
@@ -1355,7 +1360,7 @@ export function flushControlled(fn: () => mixed): void {
1360 const prevTransition = ReactCurrentBatchConfig.transition;
1361 const previousPriority = getCurrentUpdatePriority();
1362 try {
1358 - ReactCurrentBatchConfig.transition = 0;
1363 + ReactCurrentBatchConfig.transition = null;
1364 setCurrentUpdatePriority(DiscreteEventPriority);
1365 fn();
1366 } finally {
@@ -1893,7 +1898,7 @@ function commitRoot(root: FiberRoot, recoverableErrors: null | Array<mixed>) {
1898 const previousUpdateLanePriority = getCurrentUpdatePriority();
1899 const prevTransition = ReactCurrentBatchConfig.transition;
1900 try {
1896 - ReactCurrentBatchConfig.transition = 0;
1901 + ReactCurrentBatchConfig.transition = null;
1902 setCurrentUpdatePriority(DiscreteEventPriority);
1903 commitRootImpl(root, recoverableErrors, previousUpdateLanePriority);
1904 } finally {
@@ -2028,7 +2033,7 @@ function commitRootImpl(
2033
2034 if (subtreeHasEffects || rootHasEffect) {
2035 const prevTransition = ReactCurrentBatchConfig.transition;
2031 - ReactCurrentBatchConfig.transition = 0;
2036 + ReactCurrentBatchConfig.transition = null;
2037 const previousPriority = getCurrentUpdatePriority();
2038 setCurrentUpdatePriority(DiscreteEventPriority);
2039
@@ -2283,7 +2288,7 @@ export function flushPassiveEffects(): boolean {
2288 const prevTransition = ReactCurrentBatchConfig.transition;
2289 const previousPriority = getCurrentUpdatePriority();
2290 try {
2286 - ReactCurrentBatchConfig.transition = 0;
2291 + ReactCurrentBatchConfig.transition = null;
2292 setCurrentUpdatePriority(priority);
2293 return flushPassiveEffectsImpl();
2294 } finally {
packages/react/src/ReactCurrentBatchConfig.js
+3 -8
@@ -7,22 +7,17 @@
7 * @flow
8 */
9
10 -import type {Fiber} from 'react-reconciler/src/ReactInternalTypes';
10 +import type {Transition} from 'react-reconciler/src/ReactFiberTracingMarkerComponent.new';
11
12 type BatchConfig = {
13 - transition: number,
14 - _updatedFibers?: Set<Fiber>,
13 + transition: Transition | null,
14 };
15 /**
16 * Keeps track of the current batch's configuration such as how long an update
17 * should suspend for if it needs to.
18 */
19 const ReactCurrentBatchConfig: BatchConfig = {
21 - transition: 0,
20 + transition: null,
21 };
22
24 -if (__DEV__) {
25 - ReactCurrentBatchConfig._updatedFibers = new Set();
26 -}
27 -
23 export default ReactCurrentBatchConfig;
packages/react/src/ReactStartTransition.js
+11 -5
@@ -12,18 +12,24 @@ import {warnOnSubscriptionInsideStartTransition} from 'shared/ReactFeatureFlags'
12
13 export function startTransition(scope: () => void) {
14 const prevTransition = ReactCurrentBatchConfig.transition;
15 - ReactCurrentBatchConfig.transition = 1;
15 + ReactCurrentBatchConfig.transition = {};
16 + const currentTransition = ReactCurrentBatchConfig.transition;
17 +
18 + if (__DEV__) {
19 + ReactCurrentBatchConfig.transition._updatedFibers = new Set();
20 + }
21 try {
22 scope();
23 } finally {
24 ReactCurrentBatchConfig.transition = prevTransition;
25 +
26 if (__DEV__) {
27 if (
22 - prevTransition !== 1 &&
28 + prevTransition === null &&
29 warnOnSubscriptionInsideStartTransition &&
24 - ReactCurrentBatchConfig._updatedFibers
30 + currentTransition._updatedFibers
31 ) {
26 - const updatedFibersCount = ReactCurrentBatchConfig._updatedFibers.size;
32 + const updatedFibersCount = currentTransition._updatedFibers.size;
33 if (updatedFibersCount > 10) {
34 console.warn(
35 'Detected a large number of updates inside startTransition. ' +
@@ -31,7 +37,7 @@ export function startTransition(scope: () => void) {
37 'Otherwise concurrent mode guarantees are off the table.',
38 );
39 }
34 - ReactCurrentBatchConfig._updatedFibers.clear();
40 + currentTransition._updatedFibers.clear();
41 }
42 }
43 }