Site editor: fix typing performance by not rendering sidebar #56927
Conversation
This file contains 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
ellatrix
commented
Dec 10, 2023
| @@ -278,26 +278,27 @@ export default function Layout() { | |||
| ariaLabel={ __( 'Navigation' ) } | |||
| className="edit-site-layout__sidebar-region" | |||
| > | |||
| <motion.div | |||
| // The sidebar is needed for routing on mobile | |||
There was a problem hiding this comment.
Not sure what this is. If mobile routing breaks and relies on Sidebar, we should really move it out of there.
There was a problem hiding this comment.
If it's referring to isMobileViewport, then I can't see any regressions in navigating around the site editor:
2023-12-11.12.33.05.mp4
At first I thought it might be related to navigating to the style book or style revisions from the styles panel, but that's working as expected (at least the same as trunk).
There was a problem hiding this comment.
I think it refers to a previous issue shown here in this video - #51956 (comment)
I tested with this branch checked out and couldn't reproduce it.
|
Size Change: +5 B (0%) Total Size: 1.71 MB
ℹ️ View Unchanged
|
|
Flaky tests detected in 3b87088. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/7159686541
|
ellatrix
force-pushed
the
fix/site-editor-typing-performance
branch
from
7148041
to
3b87088
Compare
|
Oh wow, great find. I was just scratching my head about this on Friday: why logging in sidebar components was showing in the editor: 2023-12-11.12.30.58.mp4This PR eradicates that 🎉 |
ramonjd
approved these changes
Dec 11, 2023
There was a problem hiding this comment.
I'm inclined to ✅ this PR until @kevin940726 can confirm given that it addresses a big performance issue.
ramonjd
added
the
[Feature] Site Editor
|
Could you add some testing instructions to show what the expected performance problem that shouldn't be reproduced anymore? I play around with the branch a bit and I can still see that the sidebar is rendered in some cases (not easy to reproduce though).
I agree. But that's still the way it works now. Some of the client side routing logic still depends on the sidebar to function correctly. As mentioned in this thread, the That said, I'm not against merging this if this fixes some happy path though! 👍 |
You can check the site editor typing metric :) Ok, let's merge this and create a failing e2e test if possible so we can look for a solution that extracts routing logic from the sidebar component. I take this would be useful to show/hide the sidebar for desktop too? |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
What?
The bulk of the performance problem with the site editor seems to be coming from the sidebar. This sidebar is not even visible, but every time the record changes (which it does on type), a bunch of stuff is recalculated in
SidebarNavigationScreenPage: it's decoding stuff, stripping HTML, and worst of all counting all the words and the time it takes to read the post!Note that this will probably break "mobile routing". I have no idea what this is, but it sounds like that shouldn't be part of the sidebar component in the first place. Let's fix it.
See https://github.com/WordPress/gutenberg/pull/51558/files/86eb8475aab6e9adb7e38ab4c5e174a6aa56b8df#r1231763003
Why?
How?
Testing Instructions
Testing Instructions for Keyboard
Screenshots or screencast