diff --git a/.changeset/tender-wasps-change.md b/.changeset/tender-wasps-change.md
new file mode 100644
index 000000000..04938b598
--- /dev/null
+++ b/.changeset/tender-wasps-change.md
@@ -0,0 +1,5 @@
+---
+"@suid/material": patch
+---
+
+Improves performance by avoiding double renderings (`Avatar`, `Alert`, `Button`, `Divider`, `ListItem`, `SvgIcon`)
diff --git a/packages/material/src/Alert/Alert.tsx b/packages/material/src/Alert/Alert.tsx
index d6407aa23..340708b07 100644
--- a/packages/material/src/Alert/Alert.tsx
+++ b/packages/material/src/Alert/Alert.tsx
@@ -12,7 +12,7 @@ import alertClasses, { getAlertUtilityClass } from "./alertClasses";
 import createComponentFactory from "@suid/base/createComponentFactory";
 import { darken, lighten } from "@suid/system";
 import clsx from "clsx";
-import { Show } from "solid-js";
+import { Show, createMemo } from "solid-js";
 
 const $ = createComponentFactory<AlertTypeMap>()({
   name: "MuiAlert",
@@ -168,6 +168,8 @@ const Alert = $.component(function Alert({
   otherProps,
   props,
 }) {
+  const icon = createMemo(() => props.icon);
+  const action = createMemo(() => props.action);
   return (
     <AlertRoot
       role={props.role}
@@ -176,9 +178,9 @@ const Alert = $.component(function Alert({
       class={clsx(classes.root, otherProps.class)}
       {...otherProps}
     >
-      <Show when={props.icon !== false}>
+      <Show when={icon() !== false}>
         <AlertIcon ownerState={allProps} class={classes.icon}>
-          {props.icon ||
+          {icon() ||
             props.iconMapping?.[props.severity]?.() ||
             defaultIconMapping[props.severity]?.()}
         </AlertIcon>
@@ -186,10 +188,10 @@ const Alert = $.component(function Alert({
       <AlertMessage ownerState={allProps} class={classes.message}>
         {otherProps.children}
       </AlertMessage>
-      <Show when={!!props.action}>
-        <AlertAction class={classes.action}>{props.action}</AlertAction>
+      <Show when={action()}>
+        <AlertAction class={classes.action}>{action()}</AlertAction>
       </Show>
-      <Show when={!props.action && props.onClose}>
+      <Show when={!action() && props.onClose}>
         <AlertAction ownerState={allProps} class={classes.action}>
           <IconButton
             size="small"
diff --git a/packages/material/src/Button/Button.tsx b/packages/material/src/Button/Button.tsx
index 7743ac6f3..062c48d5d 100644
--- a/packages/material/src/Button/Button.tsx
+++ b/packages/material/src/Button/Button.tsx
@@ -354,16 +354,20 @@ const Button = $.component(function Button({
       {...otherProps}
       classes={props.classes}
     >
-      <Show when={!!props.startIcon}>
-        <ButtonStartIcon class={classes.startIcon} ownerState={allProps}>
-          {props.startIcon}
-        </ButtonStartIcon>
+      <Show when={props.startIcon}>
+        {(startIcon) => (
+          <ButtonStartIcon class={classes.startIcon} ownerState={allProps}>
+            {startIcon()}
+          </ButtonStartIcon>
+        )}
       </Show>
       {props.children}
-      <Show when={!!props.endIcon}>
-        <ButtonEndIcon class={classes.endIcon} ownerState={allProps}>
-          {props.endIcon}
-        </ButtonEndIcon>
+      <Show when={props.endIcon}>
+        {(endIcon) => (
+          <ButtonEndIcon class={classes.endIcon} ownerState={allProps}>
+            {endIcon()}
+          </ButtonEndIcon>
+        )}
       </Show>
     </ButtonRoot>
   );
diff --git a/packages/material/src/Divider/Divider.tsx b/packages/material/src/Divider/Divider.tsx
index 7839ff1a5..6b46c264b 100644
--- a/packages/material/src/Divider/Divider.tsx
+++ b/packages/material/src/Divider/Divider.tsx
@@ -219,9 +219,11 @@ const Divider = $.component(function Divider({
       class={clsx(classes.root, allProps.class)}
     >
       <Show when={allProps.children}>
-        <DividerWrapper class={classes.wrapper} ownerState={allProps}>
-          {allProps.children}
-        </DividerWrapper>
+        {(children) => (
+          <DividerWrapper class={classes.wrapper} ownerState={allProps}>
+            {children()}
+          </DividerWrapper>
+        )}
       </Show>
     </$DividerRoot>
   );
diff --git a/packages/material/src/ListItem/ListItem.tsx b/packages/material/src/ListItem/ListItem.tsx
index 1dee35273..bf9b321bf 100644
--- a/packages/material/src/ListItem/ListItem.tsx
+++ b/packages/material/src/ListItem/ListItem.tsx
@@ -208,10 +208,12 @@ const ListItem = $.component(function ListItem({
         {...componentProps}
       >
         {props.children}
-        <Show when={!!props.secondaryAction}>
-          <ListItemSecondaryAction>
-            {props.secondaryAction}
-          </ListItemSecondaryAction>
+        <Show when={props.secondaryAction}>
+          {(secondaryAction) => (
+            <ListItemSecondaryAction>
+              {secondaryAction()}
+            </ListItemSecondaryAction>
+          )}
         </Show>
       </Dynamic>
     </ListContext.Provider>
diff --git a/packages/material/src/SvgIcon/SvgIcon.tsx b/packages/material/src/SvgIcon/SvgIcon.tsx
index c6a81ca38..0d670b368 100644
--- a/packages/material/src/SvgIcon/SvgIcon.tsx
+++ b/packages/material/src/SvgIcon/SvgIcon.tsx
@@ -113,8 +113,8 @@ const SvgIcon = $.component(function SvgIcon({
       ownerState={allProps}
     >
       {props.children}
-      <Show when={!!props.titleAccess}>
-        <title>{props.titleAccess}</title>
+      <Show when={props.titleAccess}>
+        {(titleAccess) => <title>{titleAccess()}</title>}
       </Show>
     </SvgIconRoot>
   );