Skip to content
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

Typing on chrome iOS is very very slow #17729

Closed
jorgefilipecosta opened this issue Oct 2, 2019 · 8 comments · Fixed by #17869

Comments

@jorgefilipecosta
Copy link
Member

commented Oct 2, 2019

Describe the bug
When typing on an empty paragraph, after the first character is typed the editor may take 3 seconds or more to show that character.
If during the 3 seconds delay the user continues to fast type many characters to the editor becomes very very slow and the characters typed may take 30 seconds or more to appear (or never appear at all).
If we type in paragraphs with content (at least one character) the problem does not happen.

On safari, it is possible to notice something similar, but it is not as slow as in chrome.

To reproduce
Open Gutenberg on chrome for iOS type in a paragraph.
Press enter to create a new paragraph and type a character. Verify it takes more than 3 seconds for the character to appear.
Press enter to create another paragraph.
Fast type many characters verify it takes very long for the text to appear or it may not appear at all.

@dmsnell

This comment has been minimized.

Copy link
Contributor

commented Oct 3, 2019

I've been noticing extreme lag both in desktop and mobile, so I'm not sure if this is related, but I'm guessing issues on desktop are multiplied on mobile browsers.

Particularly bad is editing table cells, which might lock-up the editor for ten to twenty seconds.
On mobile I'm noticing that / commands take exceptionally long to get moving.

Also I am reproducing the new paragraph delay, measuring about four seconds on my mobile device.

@ellatrix

This comment has been minimized.

Copy link
Member

commented Oct 8, 2019

I have noticed the same on iOS Safari. It indeed seems limited to the first character of a e.g. a paragraph block.

@koke

This comment has been minimized.

Copy link
Contributor

commented Oct 9, 2019

I did some quick profiling on an iPhone XS, and it seems that somehow a selectionchange event is triggered ~200K times from a single keypress.

Screen Shot 2019-10-09 at 15 40 38

What I've seen so far is that the RichText.onSelectionChange handler ends up calling applyRecord. Then, at some point the applySelection function is called, which checks isRangeEqual and that returns false.

I'm starting to get lost, but it looks like there are two "empty" text nodes: one of them is an empty string, the other is a ZWNBSP. It seems as if the code tries to set the selection to the first empty string, then Safari somehow leaves the selection where it is, but still emits the selectionchange event. It gets stuck on this loop until some sort of garbage collection or timeout kicks in.

> selection.getRangeAt(0).startContainer.parentNode.childNodes
< NodeList [#text "", #text "", <span>] (3)
> range.startContainer.parentNode.childNodes
< NodeList [#text "", #text "", <span>] (3)
> range.startContainer.parentNode.childNodes[0] === range.startContainer
< true
> range.startContainer.parentNode.childNodes[1] === range.startContainer
< false
> selection.getRangeAt(0).startContainer.parentNode.childNodes[0] === selection.getRangeAt(0).startContainer
< false
@ellatrix

This comment has been minimized.

Copy link
Member

commented Oct 9, 2019

Thanks @koke! This is very useful! I'll have a look into this.

@ellatrix

This comment has been minimized.

Copy link
Member

commented Oct 9, 2019

@koke Does this only happen if RichText is empty for you?

@koke

This comment has been minimized.

Copy link
Contributor

commented Oct 9, 2019

I haven’t actually profiled that case, but I didn’t notice any delays typing after that first character. I can try profiling tomorrow if that’s useful

@ellatrix

This comment has been minimized.

Copy link
Member

commented Oct 9, 2019

The same thing happens for me in normal Safari. I know the cause now. Fix coming up.

@ellatrix ellatrix referenced this issue Oct 9, 2019
0 of 5 tasks complete
@youknowriad youknowriad moved this from To do to In progress in WordPress 5.3 Must Have Oct 11, 2019
WordPress 5.3 Must Have automation moved this from In progress to Done Oct 11, 2019
@rickmgithub

This comment has been minimized.

Copy link

commented Oct 14, 2019

Hello,

I have a very similar issue here....

URL: balloonmachine.net

  • Site is premium no plugins. Using block editor.
  • Occurs on Chrome and Safari on their iPad.
  • They can edit existing posts without problems but...
  • When they go to create a new post, it opens, they can type in the headline fine but when they go to enter the main block of the text, it appears very slowly. It takes seconds from when they press the key to when it appears.
  • If they switch away from the browser and come back, the words have disappeared, presumably because it hasn't saved a draft yet
  • I tried on desktop on their site and no problems, but I wasn't able to test with anyone with an iPad.

2420316-zen
15940903-hc

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
5 participants
You can’t perform that action at this time.