diff --git a/.eslintrc.js b/.eslintrc.js
index dabf91f5e35921..292b16d11e4cb3 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -159,6 +159,8 @@ module.exports = {
     'react/state-in-constructor': 'off',
     // stylistic opinion. For conditional assignment we want it outside, otherwise as static
     'react/static-property-placement': 'off',
+    // Currently not in recommended ruleset but catches real bugs.
+    'react/no-unstable-nested-components': 'error',
   },
   overrides: [
     {
diff --git a/docs/data/material/guides/routing/ListRouter.js b/docs/data/material/guides/routing/ListRouter.js
index 3d93b907acbf8a..f503a9f39cf918 100644
--- a/docs/data/material/guides/routing/ListRouter.js
+++ b/docs/data/material/guides/routing/ListRouter.js
@@ -36,20 +36,16 @@ Router.propTypes = {
   children: PropTypes.node,
 };
 
+const Link = React.forwardRef(function Link(itemProps, ref) {
+  return <RouterLink ref={ref} {...itemProps} role={undefined} />;
+});
+
 function ListItemLink(props) {
   const { icon, primary, to } = props;
 
-  const renderLink = React.useMemo(
-    () =>
-      React.forwardRef(function Link(itemProps, ref) {
-        return <RouterLink to={to} ref={ref} {...itemProps} role={undefined} />;
-      }),
-    [to],
-  );
-
   return (
     <li>
-      <ListItem button component={renderLink}>
+      <ListItem button component={Link} to={to}>
         {icon ? <ListItemIcon>{icon}</ListItemIcon> : null}
         <ListItemText primary={primary} />
       </ListItem>
diff --git a/docs/data/material/guides/routing/ListRouter.tsx b/docs/data/material/guides/routing/ListRouter.tsx
index c9126f62750b94..a994ddf3f2c672 100644
--- a/docs/data/material/guides/routing/ListRouter.tsx
+++ b/docs/data/material/guides/routing/ListRouter.tsx
@@ -38,23 +38,19 @@ interface ListItemLinkProps {
   to: string;
 }
 
+const Link = React.forwardRef<HTMLAnchorElement, RouterLinkProps>(function Link(
+  itemProps,
+  ref,
+) {
+  return <RouterLink ref={ref} {...itemProps} role={undefined} />;
+});
+
 function ListItemLink(props: ListItemLinkProps) {
   const { icon, primary, to } = props;
 
-  const renderLink = React.useMemo(
-    () =>
-      React.forwardRef<HTMLAnchorElement, Omit<RouterLinkProps, 'to'>>(function Link(
-        itemProps,
-        ref,
-      ) {
-        return <RouterLink to={to} ref={ref} {...itemProps} role={undefined} />;
-      }),
-    [to],
-  );
-
   return (
     <li>
-      <ListItem button component={renderLink}>
+      <ListItem button component={Link} to={to}>
         {icon ? <ListItemIcon>{icon}</ListItemIcon> : null}
         <ListItemText primary={primary} />
       </ListItem>
diff --git a/packages/mui-base/src/BadgeUnstyled/BadgeUnstyled.spec.tsx b/packages/mui-base/src/BadgeUnstyled/BadgeUnstyled.spec.tsx
index 8b0e5b600453e1..84b5707b1fa890 100644
--- a/packages/mui-base/src/BadgeUnstyled/BadgeUnstyled.spec.tsx
+++ b/packages/mui-base/src/BadgeUnstyled/BadgeUnstyled.spec.tsx
@@ -23,7 +23,7 @@ const Badge = React.forwardRef(function Badge(
 
 const styledBadge = <BadgeUnstyled components={{ Root, Badge }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/ButtonUnstyled/ButtonUnstyled.spec.tsx b/packages/mui-base/src/ButtonUnstyled/ButtonUnstyled.spec.tsx
index 178420e0054d83..96d0a01eaa489d 100644
--- a/packages/mui-base/src/ButtonUnstyled/ButtonUnstyled.spec.tsx
+++ b/packages/mui-base/src/ButtonUnstyled/ButtonUnstyled.spec.tsx
@@ -23,7 +23,7 @@ function ButtonWithCustomRoot(props: ButtonUnstyledProps) {
   return <ButtonUnstyled {...props} components={{ Root: CustomButtonRoot }} />;
 }
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/InputUnstyled/InputUnstyled.spec.tsx b/packages/mui-base/src/InputUnstyled/InputUnstyled.spec.tsx
index 497d0a28c34abb..6328d323a2dc68 100644
--- a/packages/mui-base/src/InputUnstyled/InputUnstyled.spec.tsx
+++ b/packages/mui-base/src/InputUnstyled/InputUnstyled.spec.tsx
@@ -23,7 +23,7 @@ const InputInput = React.forwardRef(function InputInput(
 
 const styledInput = <InputUnstyled components={{ Root: InputRoot, Input: InputInput }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/MenuItemUnstyled/MenuItemUnstyled.spec.tsx b/packages/mui-base/src/MenuItemUnstyled/MenuItemUnstyled.spec.tsx
index ea2556161876b9..30c390cb2ee602 100644
--- a/packages/mui-base/src/MenuItemUnstyled/MenuItemUnstyled.spec.tsx
+++ b/packages/mui-base/src/MenuItemUnstyled/MenuItemUnstyled.spec.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { expectType } from '@mui/types';
 import MenuItemUnstyled from '@mui/base/MenuItemUnstyled';
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/MenuUnstyled/MenuUnstyled.spec.tsx b/packages/mui-base/src/MenuUnstyled/MenuUnstyled.spec.tsx
index 3883def028129f..57ed20f7669cb3 100644
--- a/packages/mui-base/src/MenuUnstyled/MenuUnstyled.spec.tsx
+++ b/packages/mui-base/src/MenuUnstyled/MenuUnstyled.spec.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { expectType } from '@mui/types';
 import MenuUnstyled from '@mui/base/MenuUnstyled';
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/ModalUnstyled/ModalUnstyled.spec.tsx b/packages/mui-base/src/ModalUnstyled/ModalUnstyled.spec.tsx
index 1be29f164fa561..abf5aed5cce8e9 100644
--- a/packages/mui-base/src/ModalUnstyled/ModalUnstyled.spec.tsx
+++ b/packages/mui-base/src/ModalUnstyled/ModalUnstyled.spec.tsx
@@ -21,7 +21,7 @@ const styledModal = (
   </ModalUnstyled>
 );
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/MultiSelectUnstyled/MultiSelectUnstyled.spec.tsx b/packages/mui-base/src/MultiSelectUnstyled/MultiSelectUnstyled.spec.tsx
index f1bb1049b096db..93795851b2382d 100644
--- a/packages/mui-base/src/MultiSelectUnstyled/MultiSelectUnstyled.spec.tsx
+++ b/packages/mui-base/src/MultiSelectUnstyled/MultiSelectUnstyled.spec.tsx
@@ -77,7 +77,7 @@ const MultiSelectUnstyledComponentsOverridesUsingHostComponentTest = (
   />
 );
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/OptionGroupUnstyled/OptionGroupUnstyled.spec.tsx b/packages/mui-base/src/OptionGroupUnstyled/OptionGroupUnstyled.spec.tsx
index 8f2b976ee221a2..b261bc7a33730d 100644
--- a/packages/mui-base/src/OptionGroupUnstyled/OptionGroupUnstyled.spec.tsx
+++ b/packages/mui-base/src/OptionGroupUnstyled/OptionGroupUnstyled.spec.tsx
@@ -29,7 +29,7 @@ const List = React.forwardRef(function List(
 
 const option = <OptionGroupUnstyled components={{ Root, Label, List }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/OptionUnstyled/OptionUnstyled.spec.tsx b/packages/mui-base/src/OptionUnstyled/OptionUnstyled.spec.tsx
index 7238a7ec2b3242..d27bbc86f40851 100644
--- a/packages/mui-base/src/OptionUnstyled/OptionUnstyled.spec.tsx
+++ b/packages/mui-base/src/OptionUnstyled/OptionUnstyled.spec.tsx
@@ -13,7 +13,7 @@ const Root = React.forwardRef(function Root<TValue>(
 
 const option = <OptionUnstyled value={null} components={{ Root }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.spec.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.spec.tsx
index bed0345c0e0141..559ea3aaad60ca 100644
--- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.spec.tsx
+++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.spec.tsx
@@ -9,7 +9,7 @@ function Root(props: PopperUnstyledRootSlotProps) {
 
 const styledPopper = <PopperUnstyled components={{ Root }} open />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/SelectUnstyled/SelectUnstyled.spec.tsx b/packages/mui-base/src/SelectUnstyled/SelectUnstyled.spec.tsx
index a53cbd007454ae..31e72ccb351d8c 100644
--- a/packages/mui-base/src/SelectUnstyled/SelectUnstyled.spec.tsx
+++ b/packages/mui-base/src/SelectUnstyled/SelectUnstyled.spec.tsx
@@ -77,7 +77,7 @@ const SelectUnstyledComponentsOverridesUsingHostComponentTest = (
   />
 );
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/SliderUnstyled/SliderUnstyled.spec.tsx b/packages/mui-base/src/SliderUnstyled/SliderUnstyled.spec.tsx
index d40dac1ea13140..eb199868af4c7f 100644
--- a/packages/mui-base/src/SliderUnstyled/SliderUnstyled.spec.tsx
+++ b/packages/mui-base/src/SliderUnstyled/SliderUnstyled.spec.tsx
@@ -77,7 +77,7 @@ const Input = React.forwardRef(function Input(
 
 const styledSlider = <SliderUnstyled components={{ Root, Track, Rail, Thumb, Mark, MarkLabel }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/SwitchUnstyled/SwitchUnstyled.spec.tsx b/packages/mui-base/src/SwitchUnstyled/SwitchUnstyled.spec.tsx
index 78f4d91cc1fb7f..fefaf327917b6b 100644
--- a/packages/mui-base/src/SwitchUnstyled/SwitchUnstyled.spec.tsx
+++ b/packages/mui-base/src/SwitchUnstyled/SwitchUnstyled.spec.tsx
@@ -41,7 +41,7 @@ const Track = React.forwardRef(function Track(
 
 const styledSwitch = <SwitchUnstyled components={{ Root, Thumb, Track, Input }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/TabPanelUnstyled/TabPanelUnstyled.spec.tsx b/packages/mui-base/src/TabPanelUnstyled/TabPanelUnstyled.spec.tsx
index f01a52226bb3dc..90c0afc56f3be1 100644
--- a/packages/mui-base/src/TabPanelUnstyled/TabPanelUnstyled.spec.tsx
+++ b/packages/mui-base/src/TabPanelUnstyled/TabPanelUnstyled.spec.tsx
@@ -9,7 +9,7 @@ function Root(props: TabPanelUnstyledRootSlotProps) {
 
 const styledTabPanel = <TabPanelUnstyled components={{ Root }} value={0} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/TabUnstyled/TabUnstyled.spec.tsx b/packages/mui-base/src/TabUnstyled/TabUnstyled.spec.tsx
index 591d8386d3890d..9442407601760f 100644
--- a/packages/mui-base/src/TabUnstyled/TabUnstyled.spec.tsx
+++ b/packages/mui-base/src/TabUnstyled/TabUnstyled.spec.tsx
@@ -9,7 +9,7 @@ function Root(props: TabUnstyledRootSlotProps) {
 
 const styledTab = <TabUnstyled components={{ Root }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/TablePaginationUnstyled/TablePaginationActionsUnstyled.spec.tsx b/packages/mui-base/src/TablePaginationUnstyled/TablePaginationActionsUnstyled.spec.tsx
index ce5df5531a057b..3ea4548be7dbad 100644
--- a/packages/mui-base/src/TablePaginationUnstyled/TablePaginationActionsUnstyled.spec.tsx
+++ b/packages/mui-base/src/TablePaginationUnstyled/TablePaginationActionsUnstyled.spec.tsx
@@ -35,7 +35,7 @@ const styledTablePaginationActions = (
   />
 );
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   const requiredProps = {
diff --git a/packages/mui-base/src/TabsListUnstyled/TabsListUnstyled.spec.tsx b/packages/mui-base/src/TabsListUnstyled/TabsListUnstyled.spec.tsx
index 78635d38ba593c..19b3246e12c13a 100644
--- a/packages/mui-base/src/TabsListUnstyled/TabsListUnstyled.spec.tsx
+++ b/packages/mui-base/src/TabsListUnstyled/TabsListUnstyled.spec.tsx
@@ -9,7 +9,7 @@ function Root(props: TabsListUnstyledRootSlotProps) {
 
 const styledTabsList = <TabsListUnstyled components={{ Root }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-base/src/TabsUnstyled/TabsUnstyled.spec.tsx b/packages/mui-base/src/TabsUnstyled/TabsUnstyled.spec.tsx
index be9ae4a9a87f44..eb706aef2671cd 100644
--- a/packages/mui-base/src/TabsUnstyled/TabsUnstyled.spec.tsx
+++ b/packages/mui-base/src/TabsUnstyled/TabsUnstyled.spec.tsx
@@ -9,7 +9,7 @@ function Root(props: TabsUnstyledRootSlotProps) {
 
 const styledTabs = <TabsUnstyled components={{ Root }} />;
 
-const PolymorphicComponentTest = () => {
+const polymorphicComponentTest = () => {
   const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />;
 
   return (
diff --git a/packages/mui-material-next/src/Button/Button.spec.tsx b/packages/mui-material-next/src/Button/Button.spec.tsx
index ccc8462fb891a4..b1ff4e45f52344 100644
--- a/packages/mui-material-next/src/Button/Button.spec.tsx
+++ b/packages/mui-material-next/src/Button/Button.spec.tsx
@@ -11,7 +11,7 @@ const TestOverride = React.forwardRef<HTMLDivElement, { x?: number }>((props, re
 
 const FakeIcon = <div>Icon</div>;
 
-const ButtonTest = () => (
+const buttonTest = () => (
   <div>
     <Button>I am a button!</Button>
     <Button color="inherit">Contrast</Button>
diff --git a/packages/mui-material/src/Button/Button.spec.tsx b/packages/mui-material/src/Button/Button.spec.tsx
index 72e294df93bc92..e13daf6220fe9a 100644
--- a/packages/mui-material/src/Button/Button.spec.tsx
+++ b/packages/mui-material/src/Button/Button.spec.tsx
@@ -11,7 +11,7 @@ const TestOverride = React.forwardRef<HTMLDivElement, { x?: number }>((props, re
 
 const FakeIcon = () => <div>Icon</div>;
 
-const ButtonTest = () => (
+const buttonTest = () => (
   <div>
     <Button>I am a button!</Button>
     <Button color="inherit">Contrast</Button>
diff --git a/packages/mui-material/src/DialogContentText/DialogContentText.spec.tsx b/packages/mui-material/src/DialogContentText/DialogContentText.spec.tsx
index aeb4e5f5330167..c5ccfce954335c 100644
--- a/packages/mui-material/src/DialogContentText/DialogContentText.spec.tsx
+++ b/packages/mui-material/src/DialogContentText/DialogContentText.spec.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { DialogContentText } from '@mui/material';
 
-const DialogContentTextTest = () => {
+const dialogContentTextTest = () => {
   const CustomComponent: React.FC<{ prop1: string; prop2: number }> = () => <div />;
   return (
     <div>
diff --git a/packages/mui-material/src/Typography/typography.spec.tsx b/packages/mui-material/src/Typography/typography.spec.tsx
index c2ceff074efc02..fecb3dc159f5cc 100644
--- a/packages/mui-material/src/Typography/typography.spec.tsx
+++ b/packages/mui-material/src/Typography/typography.spec.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Typography } from '@mui/material';
 
-const TypographyTest = () => {
+const typographyTest = () => {
   const CustomComponent: React.FC<{ prop1: string; prop2: number }> = () => <div />;
   return (
     <div>
diff --git a/packages/mui-material/test/typescript/components.spec.tsx b/packages/mui-material/test/typescript/components.spec.tsx
index 883ff46b1f90e9..098371656766e3 100644
--- a/packages/mui-material/test/typescript/components.spec.tsx
+++ b/packages/mui-material/test/typescript/components.spec.tsx
@@ -167,7 +167,7 @@ const BottomNavigationTest = () => {
   );
 };
 
-const IconButtonTest = () => (
+const iconButtonTest = () => (
   <div>
     <IconButton aria-label="delete">
       <FakeIcon />
@@ -187,7 +187,7 @@ const IconButtonTest = () => (
   </div>
 );
 
-const IconButtonAsLinkTest = () => {
+const iconButtonAsLinkTest = () => {
   const ForwardedLink = React.forwardRef<HTMLAnchorElement, ReactRouterLinkProps>((props, ref) => (
     <ReactRouterLink {...props} ref={ref} />
   ));