Skip to content
This repository has been archived by the owner on Dec 15, 2022. It is now read-only.

performance: add more CSS containment to tree-view #1363

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

aminya
Copy link

@aminya aminya commented Oct 14, 2020

Description of the Change

This adds more CSS containment to tree-view CSS classes. This results in performance improvements by giving the hint to the browser that the size/paint/layout of these elements does not affect other elements around them.

I have added the CSS containment for each class selectively by testing all the functionalities. As you see, these do not change the functionality.

Benefits

Improves the performance and responsiveness of tree-view. The browser will not need to recalculate the styles on clicks, scrolling, drag-drop, during the loading, etc.

Quoting CSS specifications

The contain property allows an author to indicate that an element and its contents are, as much as possible, independent of the rest of the document tree. This allows user agents to utilize much stronger optimizations when rendering a page using contain properly and allows authors to be confident that their page won’t accidentally fall into a slow code path due to an innocuous change.

Alternate Designs

N/A

Possible Drawbacks

N/A

Applicable Issues

N/A

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant