-
-
Notifications
You must be signed in to change notification settings - Fork 202
Perf: Optimize GitHubOrgs with Node Pooling & Visibility #9054
Copy link
Copy link
Closed
Labels
aibugSomething isn't workingSomething isn't workingperformancePerformance improvements and optimizationsPerformance improvements and optimizations
Description
The Neo.component.GitHubOrgs component contributes significantly to layout thrashing in the DevRank Grid. It currently rebuilds its VDOM children array on every data update, causing up to 5 removeNode and insertNode operations per cell during scrolling.
Optimization Strategy:
- CSS Containment: Apply
contain: layout paint styleto.neo-github-orgs. - Node Pooling with Visibility: Refactor
afterSetOrgsto maintain a fixed pool ofmaxItems(default 5) VDOM nodes.- Initialize the pool once.
- Recycle nodes by updating attributes (
src,href). - Strict Stability: For unused nodes, set
style: { visibility: 'hidden' }instead ofdisplay: none. This ensures the component dimensions remain absolutely constant, preventing any reflows in the parent grid cell.
Benefits:
- Eliminates structural DOM changes (0 insert/remove ops).
- Guarantees Zero Layout Shift (component size is immutable).
- Isolates reflows to the component container.
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
aibugSomething isn't workingSomething isn't workingperformancePerformance improvements and optimizationsPerformance improvements and optimizations