From e8669c769dba3e55faf63841e7feb471cd1264d6 Mon Sep 17 00:00:00 2001 From: ZhuchkaTriplesix Date: Sun, 26 Jul 2026 23:30:17 +0300 Subject: [PATCH] perf(ui): RepaintBoundary on vertical split panes during settle Paint-isolate editor/results across flex changes; document that layout per tick during drag settle is expected and not mid-drag springed away. Closes #360 Co-authored-by: Cursor --- docs/perf-baseline.md | 2 +- lib/core/layout/vertical_split_pane.dart | 10 ++++++++-- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/docs/perf-baseline.md b/docs/perf-baseline.md index 2593c25f..2eade360 100644 --- a/docs/perf-baseline.md +++ b/docs/perf-baseline.md @@ -36,4 +36,4 @@ Repeat on a **120 Hz** display (budget **≤ 8.3 ms** build+raster). Prefer prof 12. **Results modes**: idle → run (spinner) → grid; force an error — mode keys morph; scrolling the grid must not fade rows. 13. **Dialog / dropdown**: open/close `showAppDialog` and a `QueryaDropdown` — enter fade-slide, exit uses exit curve; Motion Off snaps. 14. **Theme cross-fade**: Preferences → enable Animate theme + Motion Full; switch dark/light — shadcn + `AnimatedQueryaTheme` lerp. Repeat with Motion Off (snap). -15. **Split settle**: drag the connections sidebar handle and the SQL/results vertical split with a fling — mid-drag stays 1:1; release may soft-settle. Focus the handle — ring uses motion tokens (not mid-drag animation). +15. **Split settle**: drag the connections sidebar handle and the SQL/results vertical split with a fling — mid-drag stays 1:1; release may soft-settle. Focus the handle — ring uses motion tokens (not mid-drag animation). Expect **layout** of editor/results each tick (constraint/flex); paint is isolated via `RepaintBoundary` on panes — do not add mid-drag springs to “fix” that cost. diff --git a/lib/core/layout/vertical_split_pane.dart b/lib/core/layout/vertical_split_pane.dart index 8b928427..5c3a7adc 100644 --- a/lib/core/layout/vertical_split_pane.dart +++ b/lib/core/layout/vertical_split_pane.dart @@ -113,7 +113,10 @@ class _VerticalSplitPaneState extends State return Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ - Expanded(flex: topFlex, child: pair.top), + Expanded( + flex: topFlex, + child: material.RepaintBoundary(child: pair.top), + ), QueryaSplitHandle( key: widget.handleKey, axis: material.Axis.vertical, @@ -136,7 +139,10 @@ class _VerticalSplitPaneState extends State ); }, ), - Expanded(flex: bottomFlex, child: pair.bottom), + Expanded( + flex: bottomFlex, + child: material.RepaintBoundary(child: pair.bottom), + ), ], ); },