You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Currently, when dragging/clicking a pane, the pane element will add a dragging class to change the cursor style property from grab to grabbing. As the number of nodes (in other words: the amount of DOM) increases, the time it takes to recalculate the style increases, especially on Chromium-based browsers. There is a known chromium issue here that reveals that modifying the cursor style can cause this problem: https://issues.chromium.org/issues/40493007
So I applied this style change to a single div to avoid recalculating styles for a large number of elements.
Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.
This PR includes no changesets
When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types
Unfortunately this would be a breaking change. Some users might use the classes to change the cursor or do other things. We will have another look this week!
Unfortunately this would be a breaking change. Some users might use the classes to change the cursor or do other things. We will have another look this week!
Hi, I found another way to solve this problem: instead of changing the DOM, provide a new prop: paneClassName to override the className of the Pane component, which can avoid breaking changes. What do you think?
I am not sure if I understand that solution. How would it solve the issue? Can't you overwrite the existing styles if you don't want to change the cursor?
I am not sure if I understand that solution. How would it solve the issue? Can't you overwrite the existing styles if you don't want to change the cursor?
Sorry, I provided some misleading information. In fact, the style recalculation here is because the class attribute of the pane element is changed, and the descendant elements need to be recalculated. Even if its style is overwritten to keep it consistent, the style recalculation still occurs. At present, it seems that the only way to avoid it is to keep the class of the pane element unchanged. This is what I actually did in my PR
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Currently, when dragging/clicking a pane, the pane element will add a
draggingclass to change the cursor style property from grab to grabbing. As the number of nodes (in other words: the amount of DOM) increases, the time it takes to recalculate the style increases, especially on Chromium-based browsers. There is a known chromium issue here that reveals that modifying the cursor style can cause this problem: https://issues.chromium.org/issues/40493007So I applied this style change to a single div to avoid recalculating styles for a large number of elements.
This might help resolve the issue: #4527