Skip to content

Commit b87cdfd

Browse files
committed
Remove layout effect warning on the server (#26395)
## Overview This PR unfortunately removes the warning emitted when using layout effects on the server: > useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes. ## Why this warning exists The new docs explain this really well. Adding a screenshot because as part of this change, we'll be removing these docs. <img width="1562" alt="Screenshot 2023-03-15 at 10 56 17 AM" src="https://user-images.githubusercontent.com/2440089/225349148-f0e57c3f-95f5-4f2e-9178-d9b9b221c28d.png"> ## Why are we changing it In practice, users are not just ignoring this warning, but creating hooks to bypass this warning by switching the useLayoutEffect hook on the server instead of fixing it. This battle seems to be lost, so let's remove the warning so at least users don't need to use the indirection hook any more. In practice, if it's an issue, you should see the problems like flashing the wrong content on first load in development. DiffTrain build for commit f77099b.
1 parent 2a91152 commit b87cdfd

File tree

13 files changed

+19
-19
lines changed

13 files changed

+19
-19
lines changed

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -23649,7 +23649,7 @@ function createFiberRoot(
2364923649
return root;
2365023650
}
2365123651

23652-
var ReactVersion = "18.3.0-next-51a7c45f8-20230322";
23652+
var ReactVersion = "18.3.0-next-f77099b6f-20230322";
2365323653

2365423654
// Might add PROFILE later.
2365523655

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -8570,7 +8570,7 @@ var devToolsConfig$jscomp$inline_1029 = {
85708570
throw Error("TestRenderer does not support findFiberByHostInstance()");
85718571
},
85728572
bundleType: 0,
8573-
version: "18.3.0-next-51a7c45f8-20230322",
8573+
version: "18.3.0-next-f77099b6f-20230322",
85748574
rendererPackageName: "react-test-renderer"
85758575
};
85768576
var internals$jscomp$inline_1217 = {
@@ -8601,7 +8601,7 @@ var internals$jscomp$inline_1217 = {
86018601
scheduleRoot: null,
86028602
setRefreshHandler: null,
86038603
getCurrentFiber: null,
8604-
reconcilerVersion: "18.3.0-next-51a7c45f8-20230322"
8604+
reconcilerVersion: "18.3.0-next-f77099b6f-20230322"
86058605
};
86068606
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
86078607
var hook$jscomp$inline_1218 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -8995,7 +8995,7 @@ var devToolsConfig$jscomp$inline_1072 = {
89958995
throw Error("TestRenderer does not support findFiberByHostInstance()");
89968996
},
89978997
bundleType: 0,
8998-
version: "18.3.0-next-51a7c45f8-20230322",
8998+
version: "18.3.0-next-f77099b6f-20230322",
89998999
rendererPackageName: "react-test-renderer"
90009000
};
90019001
var internals$jscomp$inline_1258 = {
@@ -9026,7 +9026,7 @@ var internals$jscomp$inline_1258 = {
90269026
scheduleRoot: null,
90279027
setRefreshHandler: null,
90289028
getCurrentFiber: null,
9029-
reconcilerVersion: "18.3.0-next-51a7c45f8-20230322"
9029+
reconcilerVersion: "18.3.0-next-f77099b6f-20230322"
90309030
};
90319031
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
90329032
var hook$jscomp$inline_1259 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

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

+1-1
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-51a7c45f8-20230322";
30+
var ReactVersion = "18.3.0-next-f77099b6f-20230322";
3131

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

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

+1-1
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-51a7c45f8-20230322";
642+
exports.version = "18.3.0-next-f77099b6f-20230322";

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

+1-1
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-51a7c45f8-20230322";
645+
exports.version = "18.3.0-next-f77099b6f-20230322";
646646

647647
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
648648
if (
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
51a7c45f8799cab903693fcfdd305ce84ba15273
1+
f77099b6f1ccc658eff3467c6b9337e1b77ec854

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -26403,7 +26403,7 @@ function createFiberRoot(
2640326403
return root;
2640426404
}
2640526405

26406-
var ReactVersion = "18.3.0-next-51a7c45f8-20230322";
26406+
var ReactVersion = "18.3.0-next-f77099b6f-20230322";
2640726407

2640826408
function createPortal$1(
2640926409
children,

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -9506,7 +9506,7 @@ var roots = new Map(),
95069506
devToolsConfig$jscomp$inline_1049 = {
95079507
findFiberByHostInstance: getInstanceFromNode,
95089508
bundleType: 0,
9509-
version: "18.3.0-next-51a7c45f8-20230322",
9509+
version: "18.3.0-next-f77099b6f-20230322",
95109510
rendererPackageName: "react-native-renderer",
95119511
rendererConfig: {
95129512
getInspectorDataForViewTag: function () {
@@ -9548,7 +9548,7 @@ var internals$jscomp$inline_1292 = {
95489548
scheduleRoot: null,
95499549
setRefreshHandler: null,
95509550
getCurrentFiber: null,
9551-
reconcilerVersion: "18.3.0-next-51a7c45f8-20230322"
9551+
reconcilerVersion: "18.3.0-next-f77099b6f-20230322"
95529552
};
95539553
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
95549554
var hook$jscomp$inline_1293 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -10214,7 +10214,7 @@ var roots = new Map(),
1021410214
devToolsConfig$jscomp$inline_1128 = {
1021510215
findFiberByHostInstance: getInstanceFromNode,
1021610216
bundleType: 0,
10217-
version: "18.3.0-next-51a7c45f8-20230322",
10217+
version: "18.3.0-next-f77099b6f-20230322",
1021810218
rendererPackageName: "react-native-renderer",
1021910219
rendererConfig: {
1022010220
getInspectorDataForViewTag: function () {
@@ -10269,7 +10269,7 @@ var roots = new Map(),
1026910269
scheduleRoot: null,
1027010270
setRefreshHandler: null,
1027110271
getCurrentFiber: null,
10272-
reconcilerVersion: "18.3.0-next-51a7c45f8-20230322"
10272+
reconcilerVersion: "18.3.0-next-f77099b6f-20230322"
1027310273
});
1027410274
exports.createPortal = function (children, containerTag) {
1027510275
return createPortal$1(

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -27454,7 +27454,7 @@ function createFiberRoot(
2745427454
return root;
2745527455
}
2745627456

27457-
var ReactVersion = "18.3.0-next-51a7c45f8-20230322";
27457+
var ReactVersion = "18.3.0-next-f77099b6f-20230322";
2745827458

2745927459
function createPortal$1(
2746027460
children,

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -9695,7 +9695,7 @@ var roots = new Map(),
96959695
devToolsConfig$jscomp$inline_1111 = {
96969696
findFiberByHostInstance: getInstanceFromTag,
96979697
bundleType: 0,
9698-
version: "18.3.0-next-51a7c45f8-20230322",
9698+
version: "18.3.0-next-f77099b6f-20230322",
96999699
rendererPackageName: "react-native-renderer",
97009700
rendererConfig: {
97019701
getInspectorDataForViewTag: function () {
@@ -9737,7 +9737,7 @@ var internals$jscomp$inline_1361 = {
97379737
scheduleRoot: null,
97389738
setRefreshHandler: null,
97399739
getCurrentFiber: null,
9740-
reconcilerVersion: "18.3.0-next-51a7c45f8-20230322"
9740+
reconcilerVersion: "18.3.0-next-f77099b6f-20230322"
97419741
};
97429742
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
97439743
var hook$jscomp$inline_1362 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -10403,7 +10403,7 @@ var roots = new Map(),
1040310403
devToolsConfig$jscomp$inline_1190 = {
1040410404
findFiberByHostInstance: getInstanceFromTag,
1040510405
bundleType: 0,
10406-
version: "18.3.0-next-51a7c45f8-20230322",
10406+
version: "18.3.0-next-f77099b6f-20230322",
1040710407
rendererPackageName: "react-native-renderer",
1040810408
rendererConfig: {
1040910409
getInspectorDataForViewTag: function () {
@@ -10458,7 +10458,7 @@ var roots = new Map(),
1045810458
scheduleRoot: null,
1045910459
setRefreshHandler: null,
1046010460
getCurrentFiber: null,
10461-
reconcilerVersion: "18.3.0-next-51a7c45f8-20230322"
10461+
reconcilerVersion: "18.3.0-next-f77099b6f-20230322"
1046210462
});
1046310463
exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = {
1046410464
computeComponentStackForErrorReporting: function (reactTag) {

0 commit comments

Comments
 (0)