improve: improved performance of menu list

src/components/listview/MenuItemRenderer.tsx

@@ -1,15 +1,23 @@
 import React from 'react';
 
 type Props = {
-    children: React.ReactNode;
+  children: React.ReactNode;
 } & React.HTMLAttributes<HTMLDivElement>;
 
-function MenuItemRenderer({ children, ...rest }: Props) {
-    return (
-        <div {...rest} className={`${rest.className} transition-all duration-200 ease-out w-full h-36 bg-white rounded-3xl px-4 pt-3.5 pb-3 flex justify-between gap-4`}>
-            {children}
-        </div>
-    );
+function MenuItemRendererComponent({ children, ...rest }: Props) {
+  return (
+    <div
+      {...rest}
+      className={`${rest.className} transition-all duration-200 ease-out w-full h-36 bg-white rounded-3xl px-4 pt-3.5 pb-3 flex justify-between gap-4`}
+    >
+      {children}
+    </div>
+  );
 }
 
+// Memoize with shallow comparison of props
+const MenuItemRenderer = React.memo(MenuItemRendererComponent, (prevProps, nextProps) => {
+  return prevProps.className === nextProps.className && prevProps.children === nextProps.children;
+});
+
 export default MenuItemRenderer;