mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Refactor ReactDOMComponent to use flatter property operations (#26433)
This is in line with the refactor I already did on Fizz earlier and brings Fiber up to a similar structure. We end up with a lot of extra checks due the extra abstractions we use to check the various properties. This uses a flatter and more inline model which makes it easier to see what each property does. The tradeoff is that a change might need changes in more places. The general structure is that there's a switch for tag first, then a switch for each attribute special case, then a switch for the value. So it's easy to follow where each scenario will end up and there shouldn't be any unnecessary code executed along the way. My goal is to eventually get rid of the meta-programming in DOMProperty and CSSProperty but I'm leaving that in for now - in line with Fizz. My next step is moving around things a bit in the diff/commit phases. This is the first step to more refactors for perf and size, but also because I'm adding more special cases so I need to have a flatter structure that I can reason about for those special cases. DiffTrain build for commit https://github.com/facebook/react/commit/520f7f3ed4d01e9e50a73d7d04ff138e3c71ac86.
This commit is contained in:
+1
-1
@@ -23588,7 +23588,7 @@ function createFiberRoot(
|
||||
return root;
|
||||
}
|
||||
|
||||
var ReactVersion = "18.3.0-next-0131d0cff-20230320";
|
||||
var ReactVersion = "18.3.0-next-520f7f3ed-20230320";
|
||||
|
||||
// Might add PROFILE later.
|
||||
|
||||
|
||||
+2
-2
@@ -8561,7 +8561,7 @@ var devToolsConfig$jscomp$inline_1013 = {
|
||||
throw Error("TestRenderer does not support findFiberByHostInstance()");
|
||||
},
|
||||
bundleType: 0,
|
||||
version: "18.3.0-next-0131d0cff-20230320",
|
||||
version: "18.3.0-next-520f7f3ed-20230320",
|
||||
rendererPackageName: "react-test-renderer"
|
||||
};
|
||||
var internals$jscomp$inline_1201 = {
|
||||
@@ -8592,7 +8592,7 @@ var internals$jscomp$inline_1201 = {
|
||||
scheduleRoot: null,
|
||||
setRefreshHandler: null,
|
||||
getCurrentFiber: null,
|
||||
reconcilerVersion: "18.3.0-next-0131d0cff-20230320"
|
||||
reconcilerVersion: "18.3.0-next-520f7f3ed-20230320"
|
||||
};
|
||||
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
|
||||
var hook$jscomp$inline_1202 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
|
||||
|
||||
+2
-2
@@ -8988,7 +8988,7 @@ var devToolsConfig$jscomp$inline_1054 = {
|
||||
throw Error("TestRenderer does not support findFiberByHostInstance()");
|
||||
},
|
||||
bundleType: 0,
|
||||
version: "18.3.0-next-0131d0cff-20230320",
|
||||
version: "18.3.0-next-520f7f3ed-20230320",
|
||||
rendererPackageName: "react-test-renderer"
|
||||
};
|
||||
var internals$jscomp$inline_1240 = {
|
||||
@@ -9019,7 +9019,7 @@ var internals$jscomp$inline_1240 = {
|
||||
scheduleRoot: null,
|
||||
setRefreshHandler: null,
|
||||
getCurrentFiber: null,
|
||||
reconcilerVersion: "18.3.0-next-0131d0cff-20230320"
|
||||
reconcilerVersion: "18.3.0-next-520f7f3ed-20230320"
|
||||
};
|
||||
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
|
||||
var hook$jscomp$inline_1241 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
|
||||
|
||||
+1
-1
@@ -27,7 +27,7 @@ if (
|
||||
}
|
||||
"use strict";
|
||||
|
||||
var ReactVersion = "18.3.0-next-0131d0cff-20230320";
|
||||
var ReactVersion = "18.3.0-next-520f7f3ed-20230320";
|
||||
|
||||
// ATTENTION
|
||||
// When adding new symbols to this file,
|
||||
|
||||
+1
-1
@@ -639,4 +639,4 @@ exports.useSyncExternalStore = function (
|
||||
);
|
||||
};
|
||||
exports.useTransition = useTransition;
|
||||
exports.version = "18.3.0-next-0131d0cff-20230320";
|
||||
exports.version = "18.3.0-next-520f7f3ed-20230320";
|
||||
|
||||
+1
-1
@@ -642,7 +642,7 @@ exports.useSyncExternalStore = function (
|
||||
);
|
||||
};
|
||||
exports.useTransition = useTransition;
|
||||
exports.version = "18.3.0-next-0131d0cff-20230320";
|
||||
exports.version = "18.3.0-next-520f7f3ed-20230320";
|
||||
|
||||
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
||||
if (
|
||||
|
||||
+1
-1
@@ -26342,7 +26342,7 @@ function createFiberRoot(
|
||||
return root;
|
||||
}
|
||||
|
||||
var ReactVersion = "18.3.0-next-0131d0cff-20230320";
|
||||
var ReactVersion = "18.3.0-next-520f7f3ed-20230320";
|
||||
|
||||
function createPortal$1(
|
||||
children,
|
||||
|
||||
+2
-2
@@ -9496,7 +9496,7 @@ var roots = new Map(),
|
||||
devToolsConfig$jscomp$inline_1033 = {
|
||||
findFiberByHostInstance: getInstanceFromNode,
|
||||
bundleType: 0,
|
||||
version: "18.3.0-next-0131d0cff-20230320",
|
||||
version: "18.3.0-next-520f7f3ed-20230320",
|
||||
rendererPackageName: "react-native-renderer",
|
||||
rendererConfig: {
|
||||
getInspectorDataForViewTag: function () {
|
||||
@@ -9538,7 +9538,7 @@ var internals$jscomp$inline_1276 = {
|
||||
scheduleRoot: null,
|
||||
setRefreshHandler: null,
|
||||
getCurrentFiber: null,
|
||||
reconcilerVersion: "18.3.0-next-0131d0cff-20230320"
|
||||
reconcilerVersion: "18.3.0-next-520f7f3ed-20230320"
|
||||
};
|
||||
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
|
||||
var hook$jscomp$inline_1277 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
|
||||
|
||||
+2
-2
@@ -10206,7 +10206,7 @@ var roots = new Map(),
|
||||
devToolsConfig$jscomp$inline_1110 = {
|
||||
findFiberByHostInstance: getInstanceFromNode,
|
||||
bundleType: 0,
|
||||
version: "18.3.0-next-0131d0cff-20230320",
|
||||
version: "18.3.0-next-520f7f3ed-20230320",
|
||||
rendererPackageName: "react-native-renderer",
|
||||
rendererConfig: {
|
||||
getInspectorDataForViewTag: function () {
|
||||
@@ -10261,7 +10261,7 @@ var roots = new Map(),
|
||||
scheduleRoot: null,
|
||||
setRefreshHandler: null,
|
||||
getCurrentFiber: null,
|
||||
reconcilerVersion: "18.3.0-next-0131d0cff-20230320"
|
||||
reconcilerVersion: "18.3.0-next-520f7f3ed-20230320"
|
||||
});
|
||||
exports.createPortal = function (children, containerTag) {
|
||||
return createPortal$1(
|
||||
|
||||
+1
-1
@@ -27393,7 +27393,7 @@ function createFiberRoot(
|
||||
return root;
|
||||
}
|
||||
|
||||
var ReactVersion = "18.3.0-next-0131d0cff-20230320";
|
||||
var ReactVersion = "18.3.0-next-520f7f3ed-20230320";
|
||||
|
||||
function createPortal$1(
|
||||
children,
|
||||
|
||||
+2
-2
@@ -9685,7 +9685,7 @@ var roots = new Map(),
|
||||
devToolsConfig$jscomp$inline_1095 = {
|
||||
findFiberByHostInstance: getInstanceFromTag,
|
||||
bundleType: 0,
|
||||
version: "18.3.0-next-0131d0cff-20230320",
|
||||
version: "18.3.0-next-520f7f3ed-20230320",
|
||||
rendererPackageName: "react-native-renderer",
|
||||
rendererConfig: {
|
||||
getInspectorDataForViewTag: function () {
|
||||
@@ -9727,7 +9727,7 @@ var internals$jscomp$inline_1345 = {
|
||||
scheduleRoot: null,
|
||||
setRefreshHandler: null,
|
||||
getCurrentFiber: null,
|
||||
reconcilerVersion: "18.3.0-next-0131d0cff-20230320"
|
||||
reconcilerVersion: "18.3.0-next-520f7f3ed-20230320"
|
||||
};
|
||||
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
|
||||
var hook$jscomp$inline_1346 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
|
||||
|
||||
+2
-2
@@ -10395,7 +10395,7 @@ var roots = new Map(),
|
||||
devToolsConfig$jscomp$inline_1172 = {
|
||||
findFiberByHostInstance: getInstanceFromTag,
|
||||
bundleType: 0,
|
||||
version: "18.3.0-next-0131d0cff-20230320",
|
||||
version: "18.3.0-next-520f7f3ed-20230320",
|
||||
rendererPackageName: "react-native-renderer",
|
||||
rendererConfig: {
|
||||
getInspectorDataForViewTag: function () {
|
||||
@@ -10450,7 +10450,7 @@ var roots = new Map(),
|
||||
scheduleRoot: null,
|
||||
setRefreshHandler: null,
|
||||
getCurrentFiber: null,
|
||||
reconcilerVersion: "18.3.0-next-0131d0cff-20230320"
|
||||
reconcilerVersion: "18.3.0-next-520f7f3ed-20230320"
|
||||
});
|
||||
exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = {
|
||||
computeComponentStackForErrorReporting: function (reactTag) {
|
||||
|
||||
Reference in New Issue
Block a user