Skip to content

Commit

Permalink
Performance: block style variations: only calc styles for present inn…
Browse files Browse the repository at this point in the history
…er blocks
  • Loading branch information
ellatrix committed Jun 20, 2024
1 parent 9097405 commit eba914c
Showing 1 changed file with 34 additions and 2 deletions.
36 changes: 34 additions & 2 deletions packages/block-editor/src/hooks/block-style-variation.js
Original file line number Diff line number Diff line change
Expand Up @@ -118,17 +118,42 @@ function useBlockProps( { name, className, clientId } ) {
clientId
);

const descendantBlockNames = useSelect(
( select ) => {
// Avoid a subscription if there is no variation.
if ( ! variation ) {
return;
}
const { getClientIdsOfDescendants, getBlockName } =
select( blockEditorStore );
// Could be moved to a private memoized selector, but this also
// makes sure the reference is stable.
return JSON.stringify( [
...new Set(
[ clientId, ...getClientIdsOfDescendants( clientId ) ].map(
( id ) => getBlockName( id )
)
),
] );
},
[ clientId, variation ]
);

const variationStyles = useMemo( () => {
if ( ! variation ) {
return;
}

const variationConfig = { settings, styles };
const names = JSON.parse( descendantBlockNames );
const blockSelectors = getBlockSelectors(
getBlockTypes(),
getBlockTypes().filter( ( blockType ) =>
names.includes( blockType.name )
),
getBlockStyles,
clientId
);

const hasBlockGapSupport = false;
const hasFallbackGapSupport = true;
const disableLayoutStyles = true;
Expand All @@ -151,7 +176,14 @@ function useBlockProps( { name, className, clientId } ) {
variationStyles: true,
}
);
}, [ variation, settings, styles, getBlockStyles, clientId ] );
}, [
variation,
settings,
styles,
getBlockStyles,
clientId,
descendantBlockNames,
] );

useStyleOverride( {
id: `variation-${ clientId }`,
Expand Down

0 comments on commit eba914c

Please sign in to comment.