-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Block Editor: Optimize 'Layout' controls #55754
Conversation
Size Change: -8 B (0%) Total Size: 1.7 MB
ℹ️ View Unchanged
|
Flaky tests detected in f3b9a47. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/6717185470
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice optimization! Thanks for the continued work on removing redundant subscriptions.
In this file, the withLayoutStyles
HOC could also be optimized. If the blockSupportsLayout
value is false
, the entire HOC effectively evaluates to a noop, and yet it does one useSelect
call, one useSettings
... There's also the useLayoutClasses
hook call which is conditional (!) and therefore a potential crasher.
There's also withChildLayoutStyles
with similar opportunities: if hasChildLayout
is false
, it's a noop.
Thank you, @jsnajdr. I'll do a follow-up for remaining optimizations.
I can't find a comment now, but I remember making this unconditional had some performance drawbacks. I'll see if that can be avoided. IIRC @youknowriad pointed this one out. Update: I found the conversation - #48900 (comment). |
The const shouldRenderLayoutStyles = ...;
if ( ! shouldRenderLayoutStyles ) {
return <BlockListBlock { ...props } />
}
return (
<BlockListBlockWithLayoutStyles
block={ BlockListBlock }
props={ props }
/>
); The same technique has been already used for |
Yes. That's what I did in #55762. |
What?
Similar to #55753.
A micro-optimization for
layout
controls to avoid calling theuseBlockEditingMode
hook for every block rendered in the editor.The controls were also calling the hook twice. The second call was redundant.
Why?
The check is only needed when the block supports Layout settings.
Tested using @jsnajdr's debug code (c029303), the store subscriptions are reduction by 1000 on large text post - 1000 blocks.
How?
PR moves block editing mode check inside the
LayoutPanel
component.Testing Instructions
Testing Instructions for Keyboard
Same.
Screenshots or screencast