diff --git a/.changeset/optimized-page-layout-resize.md b/.changeset/optimized-page-layout-resize.md index ac93edd2d9c..6584fae7ebc 100644 --- a/.changeset/optimized-page-layout-resize.md +++ b/.changeset/optimized-page-layout-resize.md @@ -5,17 +5,13 @@ PageLayout: Optimize drag/resize performance with inline styles and new optimizations **Refactored:** -- Apply CSS containment via inline styles instead of `[data-dragging]` attribute selectors (O(1) vs O(n) selector matching) +- Use direct attribute selectors (`.Pane[data-dragging='true']`) instead of descendant selectors for CSS containment (O(1) vs O(n) selector matching) - Extract optimization utilities to `paneUtils.ts` -- Use CSS variable for drag handle visual feedback +- Apply drag handle visual feedback via inline styles and CSS variables **Added:** - `content-visibility: auto` during drag/resize to skip off-screen content rendering - - rAF throttle for drag updates (one update per frame, latest position wins) - Containment during window resize (parity with drag) -**Removed:** -- `[data-dragging]` attribute and associated CSS descendant selectors - These changes improve style recalculation performance on large DOMs (100k+ nodes) by eliminating descendant selector traversal.