Skip to content

Commit ddd1faa

Browse files
acdliteacdlite
authored
Remove config argument from useTransition (#19719)
And `useDeferredValue`. The options were already disabled in previous commits, so this doesn't change any behavior. I upated type signatures and cleaned up the hook implementation a bit — no longer have to wrap the `start` method with `useCallback`, because its only remaining dependency is a `setState` method, which never changes. Instead, we can store the `start` method on a ref.
1 parent 92fcd46 commit ddd1faa

10 files changed

Lines changed: 118 additions & 223 deletions

File tree

‎packages/react-debug-tools/src/ReactDebugHooks.js‎

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ import type {
2020
}from'react-reconciler/src/ReactInternalTypes';
2121
importtype{OpaqueIDType}from'react-reconciler/src/ReactFiberHostConfig';
2222

23-
importtype{SuspenseConfig}from'react-reconciler/src/ReactFiberTransition';
2423
import{NoMode}from'react-reconciler/src/ReactTypeOfMode';
2524

2625
importErrorStackParserfrom'error-stack-parser';
@@ -62,10 +61,6 @@ type Hook = {
6261
next: Hook|null,
6362
};
6463

65-
typeTimeoutConfig={|
66-
timeoutMs: number,
67-
|};
68-
6964
functiongetPrimitiveStackCache(): Map<string,Array<any>>{
7065
// This initializes a cache of all primitive hooks so that the top
7166
// most stack frames added by calling the primitive hook can be removed.
@@ -258,9 +253,7 @@ function useMutableSource<Source, Snapshot>(
258253
returnvalue;
259254
}
260255

261-
function useTransition(
262-
config: SuspenseConfig | null | void,
263-
): [(() =>void)=>void,boolean]{
256+
function useTransition(): [(() =>void)=>void,boolean]{
264257
// useTransition() composes multiple hooks internally.
265258
// Advance the current hook index the same number of times
266259
// so that subsequent hooks have the right memoized state.
@@ -269,12 +262,12 @@ function useTransition(
269262
hookLog.push({
270263
primitive: 'Transition',
271264
stackError: newError(),
272-
value: config,
265+
value: undefined,
273266
});
274267
return[callback=>{},false];
275268
}
276269

277-
function useDeferredValue<T>(value: T, config: TimeoutConfig | null | void): T {
270+
function useDeferredValue<T>(value: T): T {
278271
// useDeferredValue() composes multiple hooks internally.
279272
// Advance the current hook index the same number of times
280273
// so that subsequent hooks have the right memoized state.

‎packages/react-dom/src/server/ReactPartialRendererHooks.js‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ import type {
1515
MutableSourceSubscribeFn,
1616
ReactContext,
1717
}from'shared/ReactTypes';
18-
importtype{SuspenseConfig}from'react-reconciler/src/ReactFiberTransition';
1918
importtypePartialRendererfrom'./ReactPartialRenderer';
2019

2120
import{validateContextBounds}from'./ReactPartialRendererContext';
@@ -42,10 +41,6 @@ type Hook = {|
4241
next: Hook|null,
4342
|};
4443

45-
typeTimeoutConfig={|
46-
timeoutMs: number,
47-
|};
48-
4944
typeOpaqueIDType=string;
5045

5146
letcurrentlyRenderingComponent: Object|null=null;
@@ -468,14 +463,12 @@ function useMutableSource<Source, Snapshot>(
468463
returngetSnapshot(source._source);
469464
}
470465

471-
function useDeferredValue<T>(value: T, config: TimeoutConfig | null | void): T {
466+
function useDeferredValue<T>(value: T): T {
472467
resolveCurrentlyRenderingComponent();
473468
returnvalue;
474469
}
475470

476-
function useTransition(
477-
config: SuspenseConfig | null | void,
478-
): [(callback: () =>void)=>void,boolean]{
471+
function useTransition(): [(callback: () =>void)=>void,boolean]{
479472
resolveCurrentlyRenderingComponent();
480473
conststartTransition=callback=>{
481474
callback();

‎packages/react-reconciler/src/ReactFiberHooks.new.js‎

Lines changed: 51 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ import type {
1616
importtype{Fiber,Dispatcher}from'./ReactInternalTypes';
1717
importtype{Lanes,Lane}from'./ReactFiberLane';
1818
importtype{HookEffectTag}from'./ReactHookEffectTags';
19-
importtype{SuspenseConfig}from'./ReactFiberTransition';
2019
importtype{ReactPriorityLevel}from'./ReactInternalTypes';
2120
importtype{FiberRoot}from'./ReactInternalTypes';
2221
importtype{OpaqueIDType}from'./ReactFiberHostConfig';
@@ -151,10 +150,6 @@ export type Effect = {|
151150

152151
exporttypeFunctionComponentUpdateQueue={|lastEffect: Effect|null|};
153152

154-
typeTimeoutConfig={|
155-
timeoutMs: number,
156-
|};
157-
158153
typeBasicStateAction<S>=(S=>S)|S;
159154

160155
typeDispatch<A>=A=>void;
@@ -1432,10 +1427,7 @@ function updateMemo<T>(
14321427
return nextValue;
14331428
}
14341429

1435-
functionmountDeferredValue<T>(
1436-
value: T,
1437-
config: TimeoutConfig | void | null,
1438-
): T {
1430+
functionmountDeferredValue<T>(value: T): T {
14391431
const[prevValue,setValue]=mountState(value);
14401432
mountEffect(()=>{
14411433
constprevTransition=ReactCurrentBatchConfig.transition;
@@ -1445,14 +1437,11 @@ function mountDeferredValue<T>(
14451437
}finally{
14461438
ReactCurrentBatchConfig.transition=prevTransition;
14471439
}
1448-
},[value,config]);
1440+
},[value]);
14491441
returnprevValue;
14501442
}
14511443

1452-
function updateDeferredValue<T>(
1453-
value: T,
1454-
config: TimeoutConfig | void | null,
1455-
): T {
1444+
function updateDeferredValue<T>(value: T): T {
14561445
const[prevValue,setValue]=updateState(value);
14571446
updateEffect(()=>{
14581447
constprevTransition=ReactCurrentBatchConfig.transition;
@@ -1462,14 +1451,11 @@ function updateDeferredValue<T>(
14621451
}finally{
14631452
ReactCurrentBatchConfig.transition=prevTransition;
14641453
}
1465-
},[value,config]);
1454+
},[value]);
14661455
returnprevValue;
14671456
}
14681457

1469-
function rerenderDeferredValue<T>(
1470-
value: T,
1471-
config: TimeoutConfig | void | null,
1472-
): T {
1458+
function rerenderDeferredValue<T>(value: T): T {
14731459
const[prevValue,setValue]=rerenderState(value);
14741460
updateEffect(()=>{
14751461
constprevTransition=ReactCurrentBatchConfig.transition;
@@ -1479,11 +1465,11 @@ function rerenderDeferredValue<T>(
14791465
}finally{
14801466
ReactCurrentBatchConfig.transition=prevTransition;
14811467
}
1482-
},[value,config]);
1468+
},[value]);
14831469
returnprevValue;
14841470
}
14851471

1486-
function startTransition(setPending, config, callback) {
1472+
function startTransition(setPending, callback) {
14871473
constpriorityLevel=getCurrentPriorityLevel();
14881474
if(decoupleUpdatePriorityFromScheduler){
14891475
const previousLanePriority =getCurrentUpdateLanePriority();
@@ -1500,7 +1486,9 @@ function startTransition(setPending, config, callback) {
15001486
},
15011487
);
15021488

1503-
// If there's no SuspenseConfig set, we'll use the DefaultLanePriority for this transition.
1489+
// TODO: Can remove this. Was only necessary because we used to give
1490+
// different behavior to transitions without a config object. Now they are
1491+
// all treated the same.
15041492
setCurrentUpdateLanePriority(DefaultLanePriority);
15051493

15061494
runWithPriority(
@@ -1545,36 +1533,26 @@ function startTransition(setPending, config, callback) {
15451533
}
15461534
}
15471535

1548-
functionmountTransition(
1549-
config: SuspenseConfig|void|null,
1550-
): [(()=>void)=>void,boolean]{
1536+
functionmountTransition(): [(()=>void)=>void,boolean]{
15511537
const[isPending,setPending]=mountState(false);
1552-
conststart=mountCallback(startTransition.bind(null,setPending,config),[
1553-
setPending,
1554-
config,
1555-
]);
1538+
// The `start` method can be stored on a ref, since `setPending`
1539+
// never changes.
1540+
conststart=startTransition.bind(null,setPending);
1541+
mountRef(start);
15561542
return[start,isPending];
15571543
}
15581544

1559-
function updateTransition(
1560-
config: SuspenseConfig | void | null,
1561-
): [(() =>void)=>void,boolean]{
1562-
const[isPending,setPending]=updateState(false);
1563-
conststart=updateCallback(startTransition.bind(null,setPending,config),[
1564-
setPending,
1565-
config,
1566-
]);
1545+
function updateTransition(): [(() =>void)=>void,boolean]{
1546+
const[isPending]=updateState(false);
1547+
conststartRef=updateRef();
1548+
conststart: (()=>void)=>void=(startRef.current: any);
15671549
return[start,isPending];
15681550
}
15691551

1570-
function rerenderTransition(
1571-
config: SuspenseConfig | void | null,
1572-
): [(() =>void)=>void,boolean]{
1573-
const[isPending,setPending]=rerenderState(false);
1574-
conststart=updateCallback(startTransition.bind(null,setPending,config),[
1575-
setPending,
1576-
config,
1577-
]);
1552+
function rerenderTransition(): [(() =>void)=>void,boolean]{
1553+
const[isPending]=rerenderState(false);
1554+
conststartRef=updateRef();
1555+
conststart: (()=>void)=>void=(startRef.current: any);
15781556
return[start,isPending];
15791557
}
15801558

@@ -1986,17 +1964,15 @@ if (__DEV__) {
19861964
mountHookTypesDev();
19871965
returnmountDebugValue(value,formatterFn);
19881966
},
1989-
useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {
1967+
useDeferredValue<T>(value: T): T {
19901968
currentHookNameInDev='useDeferredValue';
19911969
mountHookTypesDev();
1992-
returnmountDeferredValue(value,config);
1970+
returnmountDeferredValue(value);
19931971
},
1994-
useTransition(
1995-
config: SuspenseConfig | void | null,
1996-
): [(() =>void)=>void,boolean]{
1972+
useTransition(): [(() =>void)=>void,boolean]{
19971973
currentHookNameInDev='useTransition';
19981974
mountHookTypesDev();
1999-
returnmountTransition(config);
1975+
returnmountTransition();
20001976
},
20011977
useMutableSource<Source,Snapshot>(
20021978
source: MutableSource<Source>,
@@ -2110,17 +2086,15 @@ if (__DEV__) {
21102086
updateHookTypesDev();
21112087
returnmountDebugValue(value,formatterFn);
21122088
},
2113-
useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {
2089+
useDeferredValue<T>(value: T): T {
21142090
currentHookNameInDev='useDeferredValue';
21152091
updateHookTypesDev();
2116-
returnmountDeferredValue(value,config);
2092+
returnmountDeferredValue(value);
21172093
},
2118-
useTransition(
2119-
config: SuspenseConfig | void | null,
2120-
): [(() =>void)=>void,boolean]{
2094+
useTransition(): [(() =>void)=>void,boolean]{
21212095
currentHookNameInDev='useTransition';
21222096
updateHookTypesDev();
2123-
returnmountTransition(config);
2097+
returnmountTransition();
21242098
},
21252099
useMutableSource<Source,Snapshot>(
21262100
source: MutableSource<Source>,
@@ -2234,17 +2208,15 @@ if (__DEV__) {
22342208
updateHookTypesDev();
22352209
returnupdateDebugValue(value,formatterFn);
22362210
},
2237-
useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {
2211+
useDeferredValue<T>(value: T): T {
22382212
currentHookNameInDev='useDeferredValue';
22392213
updateHookTypesDev();
2240-
returnupdateDeferredValue(value,config);
2214+
returnupdateDeferredValue(value);
22412215
},
2242-
useTransition(
2243-
config: SuspenseConfig | void | null,
2244-
): [(() =>void)=>void,boolean]{
2216+
useTransition(): [(() =>void)=>void,boolean]{
22452217
currentHookNameInDev='useTransition';
22462218
updateHookTypesDev();
2247-
returnupdateTransition(config);
2219+
returnupdateTransition();
22482220
},
22492221
useMutableSource<Source,Snapshot>(
22502222
source: MutableSource<Source>,
@@ -2359,17 +2331,15 @@ if (__DEV__) {
23592331
updateHookTypesDev();
23602332
returnupdateDebugValue(value,formatterFn);
23612333
},
2362-
useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {
2334+
useDeferredValue<T>(value: T): T {
23632335
currentHookNameInDev='useDeferredValue';
23642336
updateHookTypesDev();
2365-
returnrerenderDeferredValue(value,config);
2337+
returnrerenderDeferredValue(value);
23662338
},
2367-
useTransition(
2368-
config: SuspenseConfig | void | null,
2369-
): [(() =>void)=>void,boolean]{
2339+
useTransition(): [(() =>void)=>void,boolean]{
23702340
currentHookNameInDev='useTransition';
23712341
updateHookTypesDev();
2372-
returnrerenderTransition(config);
2342+
returnrerenderTransition();
23732343
},
23742344
useMutableSource<Source,Snapshot>(
23752345
source: MutableSource<Source>,
@@ -2494,19 +2464,17 @@ if (__DEV__) {
24942464
mountHookTypesDev();
24952465
returnmountDebugValue(value,formatterFn);
24962466
},
2497-
useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {
2467+
useDeferredValue<T>(value: T): T {
24982468
currentHookNameInDev='useDeferredValue';
24992469
warnInvalidHookAccess();
25002470
mountHookTypesDev();
2501-
returnmountDeferredValue(value,config);
2471+
returnmountDeferredValue(value);
25022472
},
2503-
useTransition(
2504-
config: SuspenseConfig | void | null,
2505-
): [(() =>void)=>void,boolean]{
2473+
useTransition(): [(() =>void)=>void,boolean]{
25062474
currentHookNameInDev='useTransition';
25072475
warnInvalidHookAccess();
25082476
mountHookTypesDev();
2509-
returnmountTransition(config);
2477+
returnmountTransition();
25102478
},
25112479
useMutableSource<Source,Snapshot>(
25122480
source: MutableSource<Source>,
@@ -2633,19 +2601,17 @@ if (__DEV__) {
26332601
updateHookTypesDev();
26342602
returnupdateDebugValue(value,formatterFn);
26352603
},
2636-
useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {
2604+
useDeferredValue<T>(value: T): T {
26372605
currentHookNameInDev='useDeferredValue';
26382606
warnInvalidHookAccess();
26392607
updateHookTypesDev();
2640-
returnupdateDeferredValue(value,config);
2608+
returnupdateDeferredValue(value);
26412609
},
2642-
useTransition(
2643-
config: SuspenseConfig | void | null,
2644-
): [(() =>void)=>void,boolean]{
2610+
useTransition(): [(() =>void)=>void,boolean]{
26452611
currentHookNameInDev='useTransition';
26462612
warnInvalidHookAccess();
26472613
updateHookTypesDev();
2648-
returnupdateTransition(config);
2614+
returnupdateTransition();
26492615
},
26502616
useMutableSource<Source,Snapshot>(
26512617
source: MutableSource<Source>,
@@ -2773,19 +2739,17 @@ if (__DEV__) {
27732739
updateHookTypesDev();
27742740
returnupdateDebugValue(value,formatterFn);
27752741
},
2776-
useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {
2742+
useDeferredValue<T>(value: T): T {
27772743
currentHookNameInDev='useDeferredValue';
27782744
warnInvalidHookAccess();
27792745
updateHookTypesDev();
2780-
returnrerenderDeferredValue(value,config);
2746+
returnrerenderDeferredValue(value);
27812747
},
2782-
useTransition(
2783-
config: SuspenseConfig | void | null,
2784-
): [(() =>void)=>void,boolean]{
2748+
useTransition(): [(() =>void)=>void,boolean]{
27852749
currentHookNameInDev='useTransition';
27862750
warnInvalidHookAccess();
27872751
updateHookTypesDev();
2788-
returnrerenderTransition(config);
2752+
returnrerenderTransition();
27892753
},
27902754
useMutableSource<Source,Snapshot>(
27912755
source: MutableSource<Source>,

0 commit comments

Comments
 (0)