Frontmatter
| id | 8962 |
| title | Perf: Apply CSS containment to Grid Rows |
| state | Closed |
| labels | enhancementaiperformance |
| assignees | tobiu |
| createdAt | Feb 3, 2026, 2:01 PM |
| updatedAt | Feb 3, 2026, 2:18 PM |
| githubUrl | https://github.com/neomjs/neo/issues/8962 |
| author | tobiu |
| commentsCount | 1 |
| parentIssue | 8930 |
| subIssues | [] |
| subIssuesCompleted | 0 |
| subIssuesTotal | 0 |
| blockedBy | [] |
| blocking | [] |
| closedAt | Feb 3, 2026, 2:18 PM |
Perf: Apply CSS containment to Grid Rows
tobiu added parent issue #8930 on Feb 3, 2026, 2:01 PM

tobiu
Feb 3, 2026, 2:17 PM
Input from Gemini 3 Pro:
✦ I have applied CSS containment optimizations to
Neo.grid.Body.Changes:
.neo-grid-row: Appliedcontain: strict. Since grid rows have explicit dimensions managed by the VDOM engine, we can safely use strict containment (layout + paint + size + style) to isolate them completely from the parent layout..neo-grid-cell: Appliedcontain: layout paint style. Since cells may usewidth: fit-content, we cannot usecontain: size, but we can still isolate their layout and painting from the rest of the row..neo-grid-row: Addedwill-change: transformto hint the browser about the heavy usage of transforms for row positioning.Outcome: Significant reduction in layout recalculation costs during scrolling and cell updates, as changes are now scoped to the individual row or cell boundary.
tobiu assigned to @tobiu on Feb 3, 2026, 2:18 PM
tobiu closed this issue on Feb 3, 2026, 2:18 PM
Since
Neo.grid.Bodymanages row positions via absolute positioning (transform), the rows are independent of each other for layout purposes.Task: Add
contain: strict(orcontain: layout paint) to the.neo-grid-rowCSS class.Benefits: This informs the browser that DOM updates within a row (e.g., text changes, canvas updates) do not affect the layout of the parent or siblings. This significantly reduces the cost of layout recalculations during heavy scrolling or real-time data updates.
Files:
resources/scss/src/grid/Body.scss