Performance: Memoize multi selection selectors #3170
Merged
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.
This pull request is a first pass at render performance for posts containing many blocks. I had noted that simple changes to editor state were causing the entire list of blocks to rerender, which could degrade performance particularly when many blocks exist. With the default behavior of react-redux's
connect
applying "pure" behavior, it was unexpected that other components should be rerendering aside from the one being hovered.Implementation notes:
In this case, the VisualBlockList component would rerender because the multi-selection selectors it depends on would always map to return a new instance of an array. This would cascade down to each individual block because we assign a new dynamic
ref
function reference in the VisualBlockList component. This latter behavior is similarly non-ideal, but not as simple to resolve, so will be addressed separately.Testing instructions:
Verify there are no regressions in the behavior of block multi-selection.
Ensure unit tests pass:
If you have React Developer Tools extension installed, toggle "Highlight Updates" and verify hovering only impacts relevant block (also layout, which will be debugged separately).