Skip to content

Commit a4a493a

Browse files
committed
Allow transitions to interrupt Suspensey commits (#26531)
I originally made it so that a Suspensey commit — i.e. a commit that's waiting for a stylesheet, image, or font to load before proceeding — could not be interrupted by transitions. My reasoning was that Suspensey commits always time out after a short interval, anyway, so if the incoming update isn't urgent, it's better to wait to commit the current frame instead of throwing it away. I don't think this rationale was correct, for a few reasons. There are some cases where we'll suspend for a longer duration, like stylesheets — it's nearly always a bad idea to show content before its styles have loaded, so we're going to be extend this timeout to be really long. But even in the case where the timeout is shorter, like fonts, if you get a new update, it's possible (even likely) that update will allow us to avoid showing a fallback, like by navigating to a different page. So we might as well try. The behavior now matches our behavior for interrupting a suspended render phase (i.e. `use`), which makes sense because they're not that conceptually different. DiffTrain build for commit 8888746.
1 parent ee546aa commit a4a493a

File tree

13 files changed

+94
-70
lines changed

13 files changed

+94
-70
lines changed

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-dev.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -19639,12 +19639,14 @@ function scheduleTaskForRootDuringMicrotask(root, currentTime) {
1963919639
var existingCallbackNode = root.callbackNode;
1964019640

1964119641
if (
19642+
// Check if there's nothing to work on
1964219643
nextLanes === NoLanes || // If this root is currently suspended and waiting for data to resolve, don't
1964319644
// schedule a task to render it. We'll either wait for a ping, or wait to
1964419645
// receive an update.
19645-
(isWorkLoopSuspendedOnData() && root === workInProgressRoot) || // We should only interrupt a pending commit if the new update
19646-
// is urgent.
19647-
(root.cancelPendingCommit !== null && includesOnlyNonUrgentLanes(nextLanes))
19646+
//
19647+
// Suspended render phase
19648+
(root === workInProgressRoot && isWorkLoopSuspendedOnData()) || // Suspended commit phase
19649+
root.cancelPendingCommit !== null
1964819650
) {
1964919651
// Fast path: There's nothing to work on.
1965019652
if (existingCallbackNode !== null) {
@@ -20023,8 +20025,10 @@ function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
2002320025
// finish loading.
2002420026

2002520027
if (
20026-
workInProgressSuspendedReason === SuspendedOnData &&
20027-
root === workInProgressRoot
20028+
// Suspended render phase
20029+
(root === workInProgressRoot &&
20030+
workInProgressSuspendedReason === SuspendedOnData) || // Suspended commit phase
20031+
root.cancelPendingCommit !== null
2002820032
) {
2002920033
// The incoming update might unblock the current render. Interrupt the
2003020034
// current attempt and restart from the top.
@@ -23865,7 +23869,7 @@ function createFiberRoot(
2386523869
return root;
2386623870
}
2386723871

23868-
var ReactVersion = "18.3.0-next-09c8d2563-20230331";
23872+
var ReactVersion = "18.3.0-next-888874673-20230331";
2386923873

2387023874
// Might add PROFILE later.
2387123875

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-prod.js

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6332,8 +6332,8 @@ function scheduleTaskForRootDuringMicrotask(root, currentTime) {
63326332
pingedLanes = root.callbackNode;
63336333
if (
63346334
0 === suspendedLanes ||
6335-
(2 === workInProgressSuspendedReason && root === currentTime) ||
6336-
(null !== root.cancelPendingCommit && 0 === (suspendedLanes & 42))
6335+
(root === currentTime && 2 === workInProgressSuspendedReason) ||
6336+
null !== root.cancelPendingCommit
63376337
)
63386338
return (
63396339
null !== pingedLanes &&
@@ -6433,10 +6433,12 @@ function requestUpdateLane(fiber) {
64336433
return 0 !== fiber ? fiber : 32;
64346434
}
64356435
function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
6436-
2 === workInProgressSuspendedReason &&
6437-
root === workInProgressRoot &&
6438-
(prepareFreshStack(root, 0),
6439-
markRootSuspended(root, workInProgressRootRenderLanes));
6436+
if (
6437+
(root === workInProgressRoot && 2 === workInProgressSuspendedReason) ||
6438+
null !== root.cancelPendingCommit
6439+
)
6440+
prepareFreshStack(root, 0),
6441+
markRootSuspended(root, workInProgressRootRenderLanes);
64406442
markRootUpdated(root, lane, eventTime);
64416443
if (0 === (executionContext & 2) || root !== workInProgressRoot)
64426444
root === workInProgressRoot &&
@@ -8672,7 +8674,7 @@ var devToolsConfig$jscomp$inline_1026 = {
86728674
throw Error("TestRenderer does not support findFiberByHostInstance()");
86738675
},
86748676
bundleType: 0,
8675-
version: "18.3.0-next-09c8d2563-20230331",
8677+
version: "18.3.0-next-888874673-20230331",
86768678
rendererPackageName: "react-test-renderer"
86778679
};
86788680
var internals$jscomp$inline_1218 = {
@@ -8703,7 +8705,7 @@ var internals$jscomp$inline_1218 = {
87038705
scheduleRoot: null,
87048706
setRefreshHandler: null,
87058707
getCurrentFiber: null,
8706-
reconcilerVersion: "18.3.0-next-09c8d2563-20230331"
8708+
reconcilerVersion: "18.3.0-next-888874673-20230331"
87078709
};
87088710
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
87098711
var hook$jscomp$inline_1219 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-profiling.js

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6669,8 +6669,8 @@ function scheduleTaskForRootDuringMicrotask(root, currentTime) {
66696669
pingedLanes = root.callbackNode;
66706670
if (
66716671
0 === suspendedLanes ||
6672-
(2 === workInProgressSuspendedReason && root === currentTime) ||
6673-
(null !== root.cancelPendingCommit && 0 === (suspendedLanes & 42))
6672+
(root === currentTime && 2 === workInProgressSuspendedReason) ||
6673+
null !== root.cancelPendingCommit
66746674
)
66756675
return (
66766676
null !== pingedLanes &&
@@ -6771,10 +6771,12 @@ function requestUpdateLane(fiber) {
67716771
return 0 !== fiber ? fiber : 32;
67726772
}
67736773
function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
6774-
2 === workInProgressSuspendedReason &&
6775-
root === workInProgressRoot &&
6776-
(prepareFreshStack(root, 0),
6777-
markRootSuspended(root, workInProgressRootRenderLanes));
6774+
if (
6775+
(root === workInProgressRoot && 2 === workInProgressSuspendedReason) ||
6776+
null !== root.cancelPendingCommit
6777+
)
6778+
prepareFreshStack(root, 0),
6779+
markRootSuspended(root, workInProgressRootRenderLanes);
67786780
markRootUpdated(root, lane, eventTime);
67796781
if (0 === (executionContext & 2) || root !== workInProgressRoot)
67806782
root === workInProgressRoot &&
@@ -9097,7 +9099,7 @@ var devToolsConfig$jscomp$inline_1068 = {
90979099
throw Error("TestRenderer does not support findFiberByHostInstance()");
90989100
},
90999101
bundleType: 0,
9100-
version: "18.3.0-next-09c8d2563-20230331",
9102+
version: "18.3.0-next-888874673-20230331",
91019103
rendererPackageName: "react-test-renderer"
91029104
};
91039105
var internals$jscomp$inline_1259 = {
@@ -9128,7 +9130,7 @@ var internals$jscomp$inline_1259 = {
91289130
scheduleRoot: null,
91299131
setRefreshHandler: null,
91309132
getCurrentFiber: null,
9131-
reconcilerVersion: "18.3.0-next-09c8d2563-20230331"
9133+
reconcilerVersion: "18.3.0-next-888874673-20230331"
91329134
};
91339135
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
91349136
var hook$jscomp$inline_1260 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-dev.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ if (
2727
}
2828
"use strict";
2929

30-
var ReactVersion = "18.3.0-next-09c8d2563-20230331";
30+
var ReactVersion = "18.3.0-next-888874673-20230331";
3131

3232
// ATTENTION
3333
// When adding new symbols to this file,

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-prod.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -639,4 +639,4 @@ exports.useSyncExternalStore = function (
639639
);
640640
};
641641
exports.useTransition = useTransition;
642-
exports.version = "18.3.0-next-09c8d2563-20230331";
642+
exports.version = "18.3.0-next-888874673-20230331";

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-profiling.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -642,7 +642,7 @@ exports.useSyncExternalStore = function (
642642
);
643643
};
644644
exports.useTransition = useTransition;
645-
exports.version = "18.3.0-next-09c8d2563-20230331";
645+
exports.version = "18.3.0-next-888874673-20230331";
646646

647647
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
648648
if (
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
09c8d2563300621dc91258a4c2839210e2fbdf0e
1+
888874673f81c08d9c3cfd4a56e2e93fd728894c

compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/implementations/ReactFabric-dev.fb.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -22708,12 +22708,14 @@ function scheduleTaskForRootDuringMicrotask(root, currentTime) {
2270822708
var existingCallbackNode = root.callbackNode;
2270922709

2271022710
if (
22711+
// Check if there's nothing to work on
2271122712
nextLanes === NoLanes || // If this root is currently suspended and waiting for data to resolve, don't
2271222713
// schedule a task to render it. We'll either wait for a ping, or wait to
2271322714
// receive an update.
22714-
(isWorkLoopSuspendedOnData() && root === workInProgressRoot) || // We should only interrupt a pending commit if the new update
22715-
// is urgent.
22716-
(root.cancelPendingCommit !== null && includesOnlyNonUrgentLanes(nextLanes))
22715+
//
22716+
// Suspended render phase
22717+
(root === workInProgressRoot && isWorkLoopSuspendedOnData()) || // Suspended commit phase
22718+
root.cancelPendingCommit !== null
2271722719
) {
2271822720
// Fast path: There's nothing to work on.
2271922721
if (existingCallbackNode !== null) {
@@ -23089,8 +23091,10 @@ function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
2308923091
// finish loading.
2309023092

2309123093
if (
23092-
workInProgressSuspendedReason === SuspendedOnData &&
23093-
root === workInProgressRoot
23094+
// Suspended render phase
23095+
(root === workInProgressRoot &&
23096+
workInProgressSuspendedReason === SuspendedOnData) || // Suspended commit phase
23097+
root.cancelPendingCommit !== null
2309423098
) {
2309523099
// The incoming update might unblock the current render. Interrupt the
2309623100
// current attempt and restart from the top.
@@ -27141,7 +27145,7 @@ function createFiberRoot(
2714127145
return root;
2714227146
}
2714327147

27144-
var ReactVersion = "18.3.0-next-09c8d2563-20230331";
27148+
var ReactVersion = "18.3.0-next-888874673-20230331";
2714527149

2714627150
function createPortal$1(
2714727151
children,

compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/implementations/ReactFabric-prod.fb.js

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7444,8 +7444,8 @@ function scheduleTaskForRootDuringMicrotask(root, currentTime) {
74447444
pingedLanes = root.callbackNode;
74457445
if (
74467446
0 === suspendedLanes ||
7447-
(2 === workInProgressSuspendedReason && root === currentTime) ||
7448-
(null !== root.cancelPendingCommit && 0 === (suspendedLanes & 42))
7447+
(root === currentTime && 2 === workInProgressSuspendedReason) ||
7448+
null !== root.cancelPendingCommit
74497449
)
74507450
return (
74517451
null !== pingedLanes &&
@@ -7555,10 +7555,12 @@ function requestUpdateLane(fiber) {
75557555
return fiber;
75567556
}
75577557
function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
7558-
2 === workInProgressSuspendedReason &&
7559-
root === workInProgressRoot &&
7560-
(prepareFreshStack(root, 0),
7561-
markRootSuspended(root, workInProgressRootRenderLanes));
7558+
if (
7559+
(root === workInProgressRoot && 2 === workInProgressSuspendedReason) ||
7560+
null !== root.cancelPendingCommit
7561+
)
7562+
prepareFreshStack(root, 0),
7563+
markRootSuspended(root, workInProgressRootRenderLanes);
75627564
markRootUpdated(root, lane, eventTime);
75637565
if (0 === (executionContext & 2) || root !== workInProgressRoot)
75647566
root === workInProgressRoot &&
@@ -9543,7 +9545,7 @@ var roots = new Map(),
95439545
devToolsConfig$jscomp$inline_1046 = {
95449546
findFiberByHostInstance: getInstanceFromNode,
95459547
bundleType: 0,
9546-
version: "18.3.0-next-09c8d2563-20230331",
9548+
version: "18.3.0-next-888874673-20230331",
95479549
rendererPackageName: "react-native-renderer",
95489550
rendererConfig: {
95499551
getInspectorDataForViewTag: function () {
@@ -9585,7 +9587,7 @@ var internals$jscomp$inline_1291 = {
95859587
scheduleRoot: null,
95869588
setRefreshHandler: null,
95879589
getCurrentFiber: null,
9588-
reconcilerVersion: "18.3.0-next-09c8d2563-20230331"
9590+
reconcilerVersion: "18.3.0-next-888874673-20230331"
95899591
};
95909592
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
95919593
var hook$jscomp$inline_1292 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/implementations/ReactFabric-profiling.fb.js

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7971,8 +7971,8 @@ function scheduleTaskForRootDuringMicrotask(root, currentTime) {
79717971
pingedLanes = root.callbackNode;
79727972
if (
79737973
0 === suspendedLanes ||
7974-
(2 === workInProgressSuspendedReason && root === currentTime) ||
7975-
(null !== root.cancelPendingCommit && 0 === (suspendedLanes & 42))
7974+
(root === currentTime && 2 === workInProgressSuspendedReason) ||
7975+
null !== root.cancelPendingCommit
79767976
)
79777977
return (
79787978
null !== pingedLanes &&
@@ -8083,10 +8083,12 @@ function requestUpdateLane(fiber) {
80838083
return fiber;
80848084
}
80858085
function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
8086-
2 === workInProgressSuspendedReason &&
8087-
root === workInProgressRoot &&
8088-
(prepareFreshStack(root, 0),
8089-
markRootSuspended(root, workInProgressRootRenderLanes));
8086+
if (
8087+
(root === workInProgressRoot && 2 === workInProgressSuspendedReason) ||
8088+
null !== root.cancelPendingCommit
8089+
)
8090+
prepareFreshStack(root, 0),
8091+
markRootSuspended(root, workInProgressRootRenderLanes);
80908092
markRootUpdated(root, lane, eventTime);
80918093
if (0 === (executionContext & 2) || root !== workInProgressRoot)
80928094
isDevToolsPresent && addFiberToLanesMap(root, fiber, lane),
@@ -10251,7 +10253,7 @@ var roots = new Map(),
1025110253
devToolsConfig$jscomp$inline_1124 = {
1025210254
findFiberByHostInstance: getInstanceFromNode,
1025310255
bundleType: 0,
10254-
version: "18.3.0-next-09c8d2563-20230331",
10256+
version: "18.3.0-next-888874673-20230331",
1025510257
rendererPackageName: "react-native-renderer",
1025610258
rendererConfig: {
1025710259
getInspectorDataForViewTag: function () {
@@ -10306,7 +10308,7 @@ var roots = new Map(),
1030610308
scheduleRoot: null,
1030710309
setRefreshHandler: null,
1030810310
getCurrentFiber: null,
10309-
reconcilerVersion: "18.3.0-next-09c8d2563-20230331"
10311+
reconcilerVersion: "18.3.0-next-888874673-20230331"
1031010312
});
1031110313
exports.createPortal = function (children, containerTag) {
1031210314
return createPortal$1(

0 commit comments

Comments
 (0)