diff --git a/frontend/src/js/ui-components/ComboBoxParts.tsx b/frontend/src/js/ui-components/ComboBoxParts.tsx
index b121340a6a..21d2129db8 100644
--- a/frontend/src/js/ui-components/ComboBoxParts.tsx
+++ b/frontend/src/js/ui-components/ComboBoxParts.tsx
@@ -33,7 +33,6 @@ export const listBoxItem = tv({
     // explicit: through the portal an item would inherit body's styles
     textStyle({ size: 2, tone: "default" }),
     "outline-none",
-    "transition-[background-color] duration-100",
     // hover like a menu item; a selected option keeps its tint, one step darker under the pointer
     "data-focused:bg-gray-50",
     "data-selected:bg-primary-50 data-selected:text-primary-500",
diff --git a/frontend/src/js/ui-components/GridList.tsx b/frontend/src/js/ui-components/GridList.tsx
index 4b6223ad15..ed906c48da 100644
--- a/frontend/src/js/ui-components/GridList.tsx
+++ b/frontend/src/js/ui-components/GridList.tsx
@@ -16,7 +16,6 @@ const item = tv({
     "rounded",
     "cursor-pointer",
     "outline-none",
-    "transition-[background-color] duration-100",
     "data-hovered:bg-gray-50",
     "data-selected:bg-primary-50 data-selected:text-primary-500",
     "data-selected:data-hovered:bg-primary-100",
diff --git a/frontend/src/js/ui-components/Menu.stories.tsx b/frontend/src/js/ui-components/Menu.stories.tsx
index dc283a56b2..508f43b645 100644
--- a/frontend/src/js/ui-components/Menu.stories.tsx
+++ b/frontend/src/js/ui-components/Menu.stories.tsx
@@ -103,3 +103,27 @@ export const WithTooltipOnTrigger: Story = {
     </TooltipTrigger>
   ),
 };
+
+const regions = ["North", "South", "East", "West", "Central"];
+const manyItems = Array.from({ length: 200 }, (_, i) => ({
+  id: `item-${i}`,
+  label: `${regions[i % regions.length]} region ${i + 1}${
+    i % 3 === 0 ? ", population and products per year" : ""
+  }`,
+}));
+
+/** 200 items: every hover re-renders the whole list (react-aria, see Menu.tsx) */
+export const ManyItems: Story = {
+  render: () => (
+    <MenuTrigger>
+      <Button intent="secondary">200 items</Button>
+      <Menu aria-label="Regions" onAction={(key) => console.log(key)}>
+        {manyItems.map((item) => (
+          <MenuItem key={item.id} id={item.id}>
+            {item.label}
+          </MenuItem>
+        ))}
+      </Menu>
+    </MenuTrigger>
+  ),
+};
diff --git a/frontend/src/js/ui-components/Menu.tsx b/frontend/src/js/ui-components/Menu.tsx
index 838b7b0e88..4219496a4b 100644
--- a/frontend/src/js/ui-components/Menu.tsx
+++ b/frontend/src/js/ui-components/Menu.tsx
@@ -32,9 +32,9 @@ const menuItem = tv({
     "whitespace-nowrap",
     "cursor-pointer",
     "outline-none",
+    // hover moves focus and re-renders every item, so long menus lag: adobe/react-spectrum#5897
     "data-focused:bg-gray-50",
     "data-disabled:cursor-not-allowed data-disabled:opacity-40",
-    "transition-[background-color] duration-100",
   ],
   variants: {
     danger: { true: "text-red" },