Skip to content

Commit

Permalink
[Fizz] improve Hoistable handling for Elements and Resources inside S…
Browse files Browse the repository at this point in the history
…uspense Boundaries (#28069)

Updates Fizz to handle Hoistables (Resources and Elements) in a way that
better aligns with Suspense fallbacks

1. Hoistable Elements inside a fallback (regardless of how deep and how
many additional boundaries are intermediate) will be ignored. The
reasoning is fallbacks are transient and since there is not good way to
clean up hoistables because they escape their Suspense container its
better to not emit them in the first place. SSR fallbacks are already
not full fidelity because they never hydrate so this aligns with that
somewhat.
2. Hoistable stylesheets in fallbacks will only block the reveal of a
parent suspense boundary if the fallback is going to flush with that
completed parent suspense boundary. Previously if you rendered a
stylesheet Resource inside a fallback any parent suspense boundaries
that completed after the shell flushed would include that resource in
the set required to resolve before the boundary reveal happens on the
client. This is not a semantic change, just a performance optimization
3. preconnect and preload hoistable queues are gone, if you want to
optimize resource loading you shoudl use `ReactDOM.preconnect` and
`ReactDOM.preload`. `viewport` meta tags get their own queue because
they need to go before any preloads since they affect the media state.

In addition to those functional changes this PR also refactors the
boundary resource tracking by moving it to the task rather than using
function calls at the start of each render and flush. Tasks also now
track whether they are a fallback task

supercedes prior work here: #27534

DiffTrain build for commit 554fc49.
  • Loading branch information
gnoff committed Jan 30, 2024
1 parent cb419ff commit 47a7b36
Show file tree
Hide file tree
Showing 7 changed files with 9 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -25607,7 +25607,7 @@ if (__DEV__) {
return root;
}

var ReactVersion = "18.3.0-canary-1c958aa4a-20240130";
var ReactVersion = "18.3.0-canary-554fc49f4-20240130";

// Might add PROFILE later.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9149,7 +9149,7 @@ var devToolsConfig$jscomp$inline_1029 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-canary-1c958aa4a-20240130",
version: "18.3.0-canary-554fc49f4-20240130",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1205 = {
Expand Down Expand Up @@ -9180,7 +9180,7 @@ var internals$jscomp$inline_1205 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-canary-1c958aa4a-20240130"
reconcilerVersion: "18.3.0-canary-554fc49f4-20240130"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1206 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9577,7 +9577,7 @@ var devToolsConfig$jscomp$inline_1071 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-canary-1c958aa4a-20240130",
version: "18.3.0-canary-554fc49f4-20240130",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1246 = {
Expand Down Expand Up @@ -9608,7 +9608,7 @@ var internals$jscomp$inline_1246 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-canary-1c958aa4a-20240130"
reconcilerVersion: "18.3.0-canary-554fc49f4-20240130"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1247 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ if (__DEV__) {
) {
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
}
var ReactVersion = "18.3.0-canary-1c958aa4a-20240130";
var ReactVersion = "18.3.0-canary-554fc49f4-20240130";

// ATTENTION
// When adding new symbols to this file,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -545,4 +545,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
exports.version = "18.3.0-canary-1c958aa4a-20240130";
exports.version = "18.3.0-canary-554fc49f4-20240130";
Original file line number Diff line number Diff line change
Expand Up @@ -541,7 +541,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
exports.version = "18.3.0-canary-1c958aa4a-20240130";
exports.version = "18.3.0-canary-554fc49f4-20240130";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Expand Down
Original file line number Diff line number Diff line change
@@ -1 +1 @@
1c958aa4abf9e6b638489b1d73cdb1b6dc7c3ab6
554fc49f41465d914b15dc8eb2ec094f37824f7e

0 comments on commit 47a7b36

Please sign in to comment.