Try optimise members list.

external/lang

@@ -1 +1 @@
-Subproject commit b27044c332ca419d22edbe9e7bf465a665398999
+Subproject commit 6a71c17b37127a5f4de7ff455814dd6c4c4df542

src/components/navigation/right/MemberList.tsx

@@ -4,8 +4,12 @@ import { User } from "revolt.js/dist/maps/Users";
 import styled, { css } from "styled-components";
 
 import { Text } from "preact-i18n";
+import { memo } from "preact/compat";
 
-import { useIntermediate } from "../../../context/intermediate/Intermediate";
+import {
+    Screen,
+    useIntermediate,
+} from "../../../context/intermediate/Intermediate";
 
 import { UserButton } from "../items/ButtonItem";
 
@@ -34,6 +38,31 @@ const ListCategory = styled.div<{ first?: boolean }>`
         `}
 `;
 
+const ItemContent = memo(
+    ({
+        item,
+        context,
+        openScreen,
+    }: {
+        item: User;
+        context: Channel;
+        openScreen: (screen: Screen) => void;
+    }) => (
+        <UserButton
+            key={item._id}
+            user={item}
+            margin
+            context={context}
+            onClick={() =>
+                openScreen({
+                    id: "profile",
+                    user_id: item._id,
+                })
+            }
+        />
+    ),
+);
+
 export default function MemberList({
     entries,
     context,
@@ -74,17 +103,10 @@ export default function MemberList({
 
                 return (
                     <div>
-                        <UserButton
+                        <ItemContent
-                            key={item._id}
+                            item={item}
-                            user={item}
-                            margin
                             context={context}
-                            onClick={() =>
+                            openScreen={openScreen}
-                                openScreen({
-                                    id: "profile",
-                                    user_id: item._id,
-                                })
-                            }
                         />
                     </div>
                 );

src/pages/settings/server/Members.tsx

@@ -79,9 +79,7 @@ export const Members = observer(({ server }: Props) => {
                                 </IconButton>
                             </div>
                             {selected === member._id.user && (
-                                <div
+                                <div className={styles.memberView}>
-                                    key={`drop_${member._id.user}`}
-                                    className={styles.memberView}>
                                     <Overline type="subtle">Roles</Overline>
                                     {Object.keys(server.roles ?? {}).map(
                                         (key) => {