Skip to content

Commit

Permalink
[Float][Flight] Flight support for Float (#26502)
Browse files Browse the repository at this point in the history
Stacked on #26557

Supporting Float methods such as ReactDOM.preload() are challenging for
flight because it does not have an easy means to convey direct
executions in other environments. Because the flight wire format is a
JSON-like serialization that is expected to be rendered it currently
only describes renderable elements. We need a way to convey a function
invocation that gets run in the context of the client environment
whether that is Fizz or Fiber.

Fiber is somewhat straightforward because the HostDispatcher is always
active and we can just have the FlightClient dispatch the serialized
directive.

Fizz is much more challenging becaue the dispatcher is always scoped but
the specific request the dispatch belongs to is not readily available.
Environments that support AsyncLocalStorage (or in the future
AsyncContext) we will use this to be able to resolve directives in Fizz
to the appropriate Request. For other environments directives will be
elided. Right now this is pragmatic and non-breaking because all
directives are opportunistic and non-critical. If this changes in the
future we will need to reconsider how widespread support for async
context tracking is.

For Flight, if AsyncLocalStorage is available Float methods can be
called before and after await points and be expected to work. If
AsyncLocalStorage is not available float methods called in the sync
phase of a component render will be captured but anything after an await
point will be a noop. If a float call is dropped in this manner a DEV
warning should help you realize your code may need to be modified.

This PR also introduces a way for resources (Fizz) and hints (Flight) to
flush even if there is not active task being worked on. This will help
when Float methods are called in between async points within a function
execution but the task is blocked on the entire function finishing.

This PR also introduces deduping of Hints in Flight using the same
resource keys used in Fizz. This will help shrink payload sizes when the
same hint is attempted to emit over and over again

DiffTrain build for commit 36e4cbe.
  • Loading branch information
gnoff committed Apr 22, 2023
1 parent 6267517 commit a0c9c6b
Show file tree
Hide file tree
Showing 13 changed files with 19 additions and 19 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -23848,7 +23848,7 @@ function createFiberRoot(
return root;
}

var ReactVersion = "18.3.0-next-8f4219689-20230421";
var ReactVersion = "18.3.0-next-36e4cbe2e-20230421";

// Might add PROFILE later.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8601,7 +8601,7 @@ var devToolsConfig$jscomp$inline_1021 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-next-8f4219689-20230421",
version: "18.3.0-next-36e4cbe2e-20230421",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1206 = {
Expand Down Expand Up @@ -8632,7 +8632,7 @@ var internals$jscomp$inline_1206 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-next-8f4219689-20230421"
reconcilerVersion: "18.3.0-next-36e4cbe2e-20230421"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1207 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9027,7 +9027,7 @@ var devToolsConfig$jscomp$inline_1063 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-next-8f4219689-20230421",
version: "18.3.0-next-36e4cbe2e-20230421",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1247 = {
Expand Down Expand Up @@ -9058,7 +9058,7 @@ var internals$jscomp$inline_1247 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-next-8f4219689-20230421"
reconcilerVersion: "18.3.0-next-36e4cbe2e-20230421"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1248 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ if (
}
"use strict";

var ReactVersion = "18.3.0-next-8f4219689-20230421";
var ReactVersion = "18.3.0-next-36e4cbe2e-20230421";

// ATTENTION
// When adding new symbols to this file,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -639,4 +639,4 @@ exports.useSyncExternalStore = function (
);
};
exports.useTransition = useTransition;
exports.version = "18.3.0-next-8f4219689-20230421";
exports.version = "18.3.0-next-36e4cbe2e-20230421";
Original file line number Diff line number Diff line change
Expand Up @@ -642,7 +642,7 @@ exports.useSyncExternalStore = function (
);
};
exports.useTransition = useTransition;
exports.version = "18.3.0-next-8f4219689-20230421";
exports.version = "18.3.0-next-36e4cbe2e-20230421";

/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
if (
Expand Down
Original file line number Diff line number Diff line change
@@ -1 +1 @@
8f42196892847a3dd1ab4c84eda0c8d52508ecf6
36e4cbe2e918ec9c8a7abbfda28898c835361fb2
Original file line number Diff line number Diff line change
Expand Up @@ -27158,7 +27158,7 @@ function createFiberRoot(
return root;
}

var ReactVersion = "18.3.0-next-8f4219689-20230421";
var ReactVersion = "18.3.0-next-36e4cbe2e-20230421";

function createPortal$1(
children,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9472,7 +9472,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1045 = {
findFiberByHostInstance: getInstanceFromNode,
bundleType: 0,
version: "18.3.0-next-8f4219689-20230421",
version: "18.3.0-next-36e4cbe2e-20230421",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForViewTag: function () {
Expand Down Expand Up @@ -9514,7 +9514,7 @@ var internals$jscomp$inline_1276 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-next-8f4219689-20230421"
reconcilerVersion: "18.3.0-next-36e4cbe2e-20230421"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1277 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10181,7 +10181,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1123 = {
findFiberByHostInstance: getInstanceFromNode,
bundleType: 0,
version: "18.3.0-next-8f4219689-20230421",
version: "18.3.0-next-36e4cbe2e-20230421",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForViewTag: function () {
Expand Down Expand Up @@ -10236,7 +10236,7 @@ var roots = new Map(),
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-next-8f4219689-20230421"
reconcilerVersion: "18.3.0-next-36e4cbe2e-20230421"
});
exports.createPortal = function (children, containerTag) {
return createPortal$1(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27671,7 +27671,7 @@ function createFiberRoot(
return root;
}

var ReactVersion = "18.3.0-next-8f4219689-20230421";
var ReactVersion = "18.3.0-next-36e4cbe2e-20230421";

function createPortal$1(
children,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9731,7 +9731,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1100 = {
findFiberByHostInstance: getInstanceFromTag,
bundleType: 0,
version: "18.3.0-next-8f4219689-20230421",
version: "18.3.0-next-36e4cbe2e-20230421",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForViewTag: function () {
Expand Down Expand Up @@ -9773,7 +9773,7 @@ var internals$jscomp$inline_1345 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-next-8f4219689-20230421"
reconcilerVersion: "18.3.0-next-36e4cbe2e-20230421"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1346 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10440,7 +10440,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1178 = {
findFiberByHostInstance: getInstanceFromTag,
bundleType: 0,
version: "18.3.0-next-8f4219689-20230421",
version: "18.3.0-next-36e4cbe2e-20230421",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForViewTag: function () {
Expand Down Expand Up @@ -10495,7 +10495,7 @@ var roots = new Map(),
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-next-8f4219689-20230421"
reconcilerVersion: "18.3.0-next-36e4cbe2e-20230421"
});
exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = {
computeComponentStackForErrorReporting: function (reactTag) {
Expand Down

0 comments on commit a0c9c6b

Please sign in to comment.