tenseleyflow/claudex / b67d967

Browse files

perf: content-visibility on session rows for offscreen scroll

Authored by espadonne
SHA
b67d96708a6b7368ff11f333d8f024a49a546886
Parents
f2d3758
Tree
1aba485

1 changed file

StatusFile+-
M src/components/ProjectsPane.tsx 13 1
src/components/ProjectsPane.tsxmodified
@@ -223,7 +223,19 @@ function SessionRow({
223223
   const hasLivePty = useSessionStore((s) => s.ptyIds.has(session.id));
224224
   const closeSessionPty = useSessionStore((s) => s.closeSessionPty);
225225
   return (
226
-    <div className="group/session relative">
226
+    // `content-visibility: auto` tells the browser it can skip
227
+    // layout + paint entirely for rows outside the viewport. Huge
228
+    // help for projects with hundreds of sessions where scrolling
229
+    // otherwise forces the whole ancestor chain to recalc on each
230
+    // frame. `contain-intrinsic-size` reserves a stable placeholder
231
+    // so the scrollbar doesn't jitter as rows virtualize in/out.
232
+    <div
233
+      className="group/session relative"
234
+      style={{
235
+        contentVisibility: "auto",
236
+        containIntrinsicSize: "0 56px",
237
+      }}
238
+    >
227239
       <button
228240
         type="button"
229241
         onClick={onSelect}