- Replace transition-all with transition-[width] in Sidebar.tsx for width animations
- Replace transition-all with specific properties in animated-tabs.tsx for hover/active indicators
- Replace transition-all with transition-[background-color,border-color,box-shadow] in navbar.tsx
- Replace transition-all with transition-[width] in audio.tsx volume bar
- Replace transition-all with transition-[background-color,border-color,color] in thread.tsx
- Replace transition-all with transition-[box-shadow] in all tool-ui status cards (28+ files)
This reduces unnecessary browser layout/paint work by only animating the specific
properties that change, avoiding expensive recalculations for properties like
width, height, margin, and padding that don't need animation.
Fixes#1147
- Replace width animation with translateX for GPU acceleration
- Set fixed width on panel and animate x position instead
- Prevents layout recalculation on every animation frame
- Runs on compositor thread without triggering reflow
- Updated the development script to include a build step before launching the app.
- Refactored the registration of quick ask and autocomplete functionalities to be asynchronous, ensuring proper initialization.
- Introduced IPC channels for getting and setting keyboard shortcuts, allowing users to customize their experience.
- Enhanced the platform module to support better interaction with the Electron API for clipboard operations.
- Improved the user interface for managing keyboard shortcuts in the settings dialog, providing a more intuitive experience.
Wrap scroll handlers in thread.tsx, InboxSidebar.tsx, and
DocumentsTableShell.tsx with requestAnimationFrame batching so scroll
position state updates fire at most once per animation frame instead of
on every scroll event (up to 60/sec at 60fps). Add cleanup useEffect to
cancel pending frames on unmount.
Fixes#1103
Apply content-visibility: auto to off-screen list and sidebar items
to skip browser layout and painting until they scroll into view.
Changes:
- globals.css: add .list-item-lazy (48px) and .sidebar-item-lazy (40px) utilities
- DocumentsTableShell: apply list-item-lazy to desktop <tr> rows and mobile card divs
- AllPrivateChatsSidebar: apply sidebar-item-lazy to thread items
- AllSharedChatsSidebar: apply sidebar-item-lazy to thread items
- InboxSidebar: apply content-visibility inline (80px intrinsic height) to inbox items
Implements Vercel React Best Practices Rule: rendering-content-visibility (6.2)