Skip to content

Commit c0bd89e

Browse files
pull[bot]pull[bot]
committed
[Fizz] Outline if a boundary would add too many bytes to the next completion (facebook#33029)
Follow up to facebook#33027. This enhances the heuristic so that we accumulate the size of the currently written boundaries. Starting from the size of the root (minus preamble) for the shell. This ensures that if you have many small boundaries they don't all continue to get inlined. For example, you can wrap each paragraph in a document in a Suspense boundary to regain document streaming capabilities if that's what you want. However, one consideration is if it's worth producing a fallback at all. Maybe if it's like `null` it's free but if it's like a whole alternative page, then it's not. It's possible to have completely useless Suspense boundaries such as when you nest several directly inside each other. So this uses a limit of at least 500 bytes of the content itself for it to be worth outlining at all. It also can't be too small because then for example a long list of paragraphs can never be outlined. In the fixture I straddle this limit so some paragraphs are too small to be considered. An unfortunate effect of that is that you can end up with some of them not being outlined which means that they appear out of order. SuspenseList is supposed to address that but it's unfortunate. The limit is still fairly high though so it's unlikely that by default you'd start outlining anything within the viewport at all. I had to reduce the `progressiveChunkSize` by an order of magnitude in my fixture to try it out properly. DiffTrain build for [18212ca](facebook@18212ca)
1 parent 4e3dffa commit c0bd89e

23 files changed

+106
-98
lines changed

‎compiled-rn/VERSION_NATIVE_FB

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
19.2.0-native-fb-0038c501-20250429
1+
19.2.0-native-fb-18212ca9-20250429

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-dev.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<ad23a59b46a733dcb0df365ac961b559>>
10+
* @generated SignedSource<<f7ec4db7e380a206fadde7831fc89838>>
1111
*/
1212

1313
"use strict";
@@ -404,5 +404,5 @@ __DEV__ &&
404404
exports.useFormStatus = function () {
405405
return resolveDispatcher().useHostTransitionStatus();
406406
};
407-
exports.version = "19.2.0-native-fb-0038c501-20250429";
407+
exports.version = "19.2.0-native-fb-18212ca9-20250429";
408408
})();

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-prod.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<0174cc70e7e9694eec9f18abeb2f5b19>>
10+
* @generated SignedSource<<46f2422054ebe01b1254a007ec1d8de0>>
1111
*/
1212

1313
"use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
203203
exports.useFormStatus = function () {
204204
return ReactSharedInternals.H.useHostTransitionStatus();
205205
};
206-
exports.version = "19.2.0-native-fb-0038c501-20250429";
206+
exports.version = "19.2.0-native-fb-18212ca9-20250429";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-profiling.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<0174cc70e7e9694eec9f18abeb2f5b19>>
10+
* @generated SignedSource<<46f2422054ebe01b1254a007ec1d8de0>>
1111
*/
1212

1313
"use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
203203
exports.useFormStatus = function () {
204204
return ReactSharedInternals.H.useHostTransitionStatus();
205205
};
206-
exports.version = "19.2.0-native-fb-0038c501-20250429";
206+
exports.version = "19.2.0-native-fb-18212ca9-20250429";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-dev.js

+10-8
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<1960f570368733d578b6de81a3a6772c>>
10+
* @generated SignedSource<<22bd78c632716ab824d86a5a503b974a>>
1111
*/
1212

1313
/*
@@ -8177,10 +8177,12 @@ __DEV__ &&
81778177
console.error(
81788178
"requestFormReset was called outside a transition or action. To fix, move to an action, or wrap with startTransition."
81798179
);
8180-
var resetStateQueue = ensureFormComponentIsStateful(formFiber).next.queue;
8180+
var stateHook = ensureFormComponentIsStateful(formFiber);
8181+
null === stateHook.next &&
8182+
(stateHook = formFiber.alternate.memoizedState);
81818183
dispatchSetStateInternal(
81828184
formFiber,
8183-
resetStateQueue,
8185+
stateHook.next.queue,
81848186
{},
81858187
requestUpdateLane(formFiber)
81868188
);
@@ -26236,11 +26238,11 @@ __DEV__ &&
2623626238
};
2623726239
(function () {
2623826240
var isomorphicReactPackageVersion = React.version;
26239-
if ("19.2.0-native-fb-0038c501-20250429" !== isomorphicReactPackageVersion)
26241+
if ("19.2.0-native-fb-18212ca9-20250429" !== isomorphicReactPackageVersion)
2624026242
throw Error(
2624126243
'Incompatible React versions: The "react" and "react-dom" packages must have the exact same version. Instead got:\n - react: ' +
2624226244
(isomorphicReactPackageVersion +
26243-
"\n - react-dom: 19.2.0-native-fb-0038c501-20250429\nLearn more: https://react.dev/warnings/version-mismatch")
26245+
"\n - react-dom: 19.2.0-native-fb-18212ca9-20250429\nLearn more: https://react.dev/warnings/version-mismatch")
2624426246
);
2624526247
})();
2624626248
("function" === typeof Map &&
@@ -26277,10 +26279,10 @@ __DEV__ &&
2627726279
!(function () {
2627826280
var internals = {
2627926281
bundleType: 1,
26280-
version: "19.2.0-native-fb-0038c501-20250429",
26282+
version: "19.2.0-native-fb-18212ca9-20250429",
2628126283
rendererPackageName: "react-dom",
2628226284
currentDispatcherRef: ReactSharedInternals,
26283-
reconcilerVersion: "19.2.0-native-fb-0038c501-20250429"
26285+
reconcilerVersion: "19.2.0-native-fb-18212ca9-20250429"
2628426286
};
2628526287
internals.overrideHookState = overrideHookState;
2628626288
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -26424,5 +26426,5 @@ __DEV__ &&
2642426426
listenToAllSupportedEvents(container);
2642526427
return new ReactDOMHydrationRoot(initialChildren);
2642626428
};
26427-
exports.version = "19.2.0-native-fb-0038c501-20250429";
26429+
exports.version = "19.2.0-native-fb-18212ca9-20250429";
2642826430
})();

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-prod.js

+9-8
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<638434daf1c86509eea1173db6df4fc2>>
10+
* @generated SignedSource<<e3a0288a60c2f7047fa32382129e27d0>>
1111
*/
1212

1313
/*
@@ -5440,10 +5440,11 @@ function ensureFormComponentIsStateful(formFiber) {
54405440
return existingStateHook;
54415441
}
54425442
function requestFormReset$1(formFiber) {
5443-
var resetStateQueue = ensureFormComponentIsStateful(formFiber).next.queue;
5443+
var stateHook = ensureFormComponentIsStateful(formFiber);
5444+
null === stateHook.next && (stateHook = formFiber.alternate.memoizedState);
54445445
dispatchSetStateInternal(
54455446
formFiber,
5446-
resetStateQueue,
5447+
stateHook.next.queue,
54475448
{},
54485449
requestUpdateLane(formFiber)
54495450
);
@@ -16334,14 +16335,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
1633416335
};
1633516336
var isomorphicReactPackageVersion$jscomp$inline_1838 = React.version;
1633616337
if (
16337-
"19.2.0-native-fb-0038c501-20250429" !==
16338+
"19.2.0-native-fb-18212ca9-20250429" !==
1633816339
isomorphicReactPackageVersion$jscomp$inline_1838
1633916340
)
1634016341
throw Error(
1634116342
formatProdErrorMessage(
1634216343
527,
1634316344
isomorphicReactPackageVersion$jscomp$inline_1838,
16344-
"19.2.0-native-fb-0038c501-20250429"
16345+
"19.2.0-native-fb-18212ca9-20250429"
1634516346
)
1634616347
);
1634716348
ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -16363,10 +16364,10 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
1636316364
};
1636416365
var internals$jscomp$inline_2316 = {
1636516366
bundleType: 0,
16366-
version: "19.2.0-native-fb-0038c501-20250429",
16367+
version: "19.2.0-native-fb-18212ca9-20250429",
1636716368
rendererPackageName: "react-dom",
1636816369
currentDispatcherRef: ReactSharedInternals,
16369-
reconcilerVersion: "19.2.0-native-fb-0038c501-20250429"
16370+
reconcilerVersion: "19.2.0-native-fb-18212ca9-20250429"
1637016371
};
1637116372
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
1637216373
var hook$jscomp$inline_2317 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -16470,4 +16471,4 @@ exports.hydrateRoot = function (container, initialChildren, options) {
1647016471
listenToAllSupportedEvents(container);
1647116472
return new ReactDOMHydrationRoot(initialChildren);
1647216473
};
16473-
exports.version = "19.2.0-native-fb-0038c501-20250429";
16474+
exports.version = "19.2.0-native-fb-18212ca9-20250429";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-profiling.js

+9-8
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<692b0056c27fb8495e61537b77520b77>>
10+
* @generated SignedSource<<b334d41cba9f1262ff441c4cf1f20237>>
1111
*/
1212

1313
/*
@@ -5599,10 +5599,11 @@ function ensureFormComponentIsStateful(formFiber) {
55995599
return existingStateHook;
56005600
}
56015601
function requestFormReset$1(formFiber) {
5602-
var resetStateQueue = ensureFormComponentIsStateful(formFiber).next.queue;
5602+
var stateHook = ensureFormComponentIsStateful(formFiber);
5603+
null === stateHook.next && (stateHook = formFiber.alternate.memoizedState);
56035604
dispatchSetStateInternal(
56045605
formFiber,
5605-
resetStateQueue,
5606+
stateHook.next.queue,
56065607
{},
56075608
requestUpdateLane(formFiber)
56085609
);
@@ -17043,14 +17044,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
1704317044
};
1704417045
var isomorphicReactPackageVersion$jscomp$inline_1941 = React.version;
1704517046
if (
17046-
"19.2.0-native-fb-0038c501-20250429" !==
17047+
"19.2.0-native-fb-18212ca9-20250429" !==
1704717048
isomorphicReactPackageVersion$jscomp$inline_1941
1704817049
)
1704917050
throw Error(
1705017051
formatProdErrorMessage(
1705117052
527,
1705217053
isomorphicReactPackageVersion$jscomp$inline_1941,
17053-
"19.2.0-native-fb-0038c501-20250429"
17054+
"19.2.0-native-fb-18212ca9-20250429"
1705417055
)
1705517056
);
1705617057
ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -17072,10 +17073,10 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
1707217073
};
1707317074
var internals$jscomp$inline_1948 = {
1707417075
bundleType: 0,
17075-
version: "19.2.0-native-fb-0038c501-20250429",
17076+
version: "19.2.0-native-fb-18212ca9-20250429",
1707617077
rendererPackageName: "react-dom",
1707717078
currentDispatcherRef: ReactSharedInternals,
17078-
reconcilerVersion: "19.2.0-native-fb-0038c501-20250429",
17079+
reconcilerVersion: "19.2.0-native-fb-18212ca9-20250429",
1707917080
getLaneLabelMap: function () {
1708017081
for (
1708117082
var map = new Map(), lane = 1, index$304 = 0;
@@ -17194,4 +17195,4 @@ exports.hydrateRoot = function (container, initialChildren, options) {
1719417195
listenToAllSupportedEvents(container);
1719517196
return new ReactDOMHydrationRoot(initialChildren);
1719617197
};
17197-
exports.version = "19.2.0-native-fb-0038c501-20250429";
17198+
exports.version = "19.2.0-native-fb-18212ca9-20250429";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMProfiling-dev.js

+10-8
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<c3937861fd3cfe1bbb79f461ca397859>>
10+
* @generated SignedSource<<5623051866512179cf3bd526f720847d>>
1111
*/
1212

1313
/*
@@ -8185,10 +8185,12 @@ __DEV__ &&
81858185
console.error(
81868186
"requestFormReset was called outside a transition or action. To fix, move to an action, or wrap with startTransition."
81878187
);
8188-
var resetStateQueue = ensureFormComponentIsStateful(formFiber).next.queue;
8188+
var stateHook = ensureFormComponentIsStateful(formFiber);
8189+
null === stateHook.next &&
8190+
(stateHook = formFiber.alternate.memoizedState);
81898191
dispatchSetStateInternal(
81908192
formFiber,
8191-
resetStateQueue,
8193+
stateHook.next.queue,
81928194
{},
81938195
requestUpdateLane(formFiber)
81948196
);
@@ -26297,11 +26299,11 @@ __DEV__ &&
2629726299
};
2629826300
(function () {
2629926301
var isomorphicReactPackageVersion = React.version;
26300-
if ("19.2.0-native-fb-0038c501-20250429" !== isomorphicReactPackageVersion)
26302+
if ("19.2.0-native-fb-18212ca9-20250429" !== isomorphicReactPackageVersion)
2630126303
throw Error(
2630226304
'Incompatible React versions: The "react" and "react-dom" packages must have the exact same version. Instead got:\n - react: ' +
2630326305
(isomorphicReactPackageVersion +
26304-
"\n - react-dom: 19.2.0-native-fb-0038c501-20250429\nLearn more: https://react.dev/warnings/version-mismatch")
26306+
"\n - react-dom: 19.2.0-native-fb-18212ca9-20250429\nLearn more: https://react.dev/warnings/version-mismatch")
2630526307
);
2630626308
})();
2630726309
("function" === typeof Map &&
@@ -26338,10 +26340,10 @@ __DEV__ &&
2633826340
!(function () {
2633926341
var internals = {
2634026342
bundleType: 1,
26341-
version: "19.2.0-native-fb-0038c501-20250429",
26343+
version: "19.2.0-native-fb-18212ca9-20250429",
2634226344
rendererPackageName: "react-dom",
2634326345
currentDispatcherRef: ReactSharedInternals,
26344-
reconcilerVersion: "19.2.0-native-fb-0038c501-20250429"
26346+
reconcilerVersion: "19.2.0-native-fb-18212ca9-20250429"
2634526347
};
2634626348
internals.overrideHookState = overrideHookState;
2634726349
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -26801,7 +26803,7 @@ __DEV__ &&
2680126803
exports.useFormStatus = function () {
2680226804
return resolveDispatcher().useHostTransitionStatus();
2680326805
};
26804-
exports.version = "19.2.0-native-fb-0038c501-20250429";
26806+
exports.version = "19.2.0-native-fb-18212ca9-20250429";
2680526807
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
2680626808
"function" ===
2680726809
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMProfiling-prod.js

+9-8
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<567daf56c9bec1598de3d0108311e62b>>
10+
* @generated SignedSource<<d7cd7e3a54282210b3cc96303eb04222>>
1111
*/
1212

1313
/*
@@ -5440,10 +5440,11 @@ function ensureFormComponentIsStateful(formFiber) {
54405440
return existingStateHook;
54415441
}
54425442
function requestFormReset$2(formFiber) {
5443-
var resetStateQueue = ensureFormComponentIsStateful(formFiber).next.queue;
5443+
var stateHook = ensureFormComponentIsStateful(formFiber);
5444+
null === stateHook.next && (stateHook = formFiber.alternate.memoizedState);
54445445
dispatchSetStateInternal(
54455446
formFiber,
5446-
resetStateQueue,
5447+
stateHook.next.queue,
54475448
{},
54485449
requestUpdateLane(formFiber)
54495450
);
@@ -16345,14 +16346,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
1634516346
};
1634616347
var isomorphicReactPackageVersion$jscomp$inline_1839 = React.version;
1634716348
if (
16348-
"19.2.0-native-fb-0038c501-20250429" !==
16349+
"19.2.0-native-fb-18212ca9-20250429" !==
1634916350
isomorphicReactPackageVersion$jscomp$inline_1839
1635016351
)
1635116352
throw Error(
1635216353
formatProdErrorMessage(
1635316354
527,
1635416355
isomorphicReactPackageVersion$jscomp$inline_1839,
16355-
"19.2.0-native-fb-0038c501-20250429"
16356+
"19.2.0-native-fb-18212ca9-20250429"
1635616357
)
1635716358
);
1635816359
ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -16374,10 +16375,10 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
1637416375
};
1637516376
var internals$jscomp$inline_2319 = {
1637616377
bundleType: 0,
16377-
version: "19.2.0-native-fb-0038c501-20250429",
16378+
version: "19.2.0-native-fb-18212ca9-20250429",
1637816379
rendererPackageName: "react-dom",
1637916380
currentDispatcherRef: ReactSharedInternals,
16380-
reconcilerVersion: "19.2.0-native-fb-0038c501-20250429"
16381+
reconcilerVersion: "19.2.0-native-fb-18212ca9-20250429"
1638116382
};
1638216383
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
1638316384
var hook$jscomp$inline_2320 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -16635,4 +16636,4 @@ exports.useFormState = function (action, initialState, permalink) {
1663516636
exports.useFormStatus = function () {
1663616637
return ReactSharedInternals.H.useHostTransitionStatus();
1663716638
};
16638-
exports.version = "19.2.0-native-fb-0038c501-20250429";
16639+
exports.version = "19.2.0-native-fb-18212ca9-20250429";

0 commit comments

Comments
 (0)