New issue
Advanced search Search tips

Issue 725077 link

Starred by 5 users

Issue metadata

Status: WontFix
Owner: ----
Closed: May 2017
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 3
Type: Bug



Sign in to add a comment

Super long layout

Project Member Reported by aerotwist@chromium.org, May 22 2017

Issue description

Chrome Version: 60.0.3107.0
OS: OSX

What steps will reproduce the problem?
(1) Head to https://jsconsole2-gfpysnfqsi.now.sh/
(2) Click the little search / magnifying glass icon (see attached image)
(3) Enter 'onpage' in the box
(4) hit backspace
(5) multi-second hang happens here

What is the expected result?

A fairly speedy result

What happens instead?

The page hangs for a second on a MacBook Pro doing layout.

I've attached a trace, but I get very little out of the Layout record to help dive into why the Layout is 1s+ in duration
 
trace_jsconsole-canary.json.gz
907 KB Download
jsconsole.png
28.5 KB View Download

Comment 1 by remysh...@gmail.com, May 22 2017

Just to update, the immutable URL for that deployment is here: https://jsconsole2-gfpysnfqsi.now.sh (i.e. I may publish changes to the 2-dot url in future).

Comment 2 by remysh...@gmail.com, May 22 2017

Adding to this, I'm almost certain it's linked to recursion in that the logger (the web output) is showing `inner*` fields, and by typing in the input field, the value of `inner*` is changing.

Comment 3 by atotic@chromium.org, May 22 2017

It is instant on my linux box, 60.0.3100.0
Hmm.. try `onpage` or `inner` and backspace.


Trace attached with `disabled-by-default-blink.debug.layout` flipped on. Screenshot from it (and a 5s layout) attached, too.

Screen Shot 2017-05-22 at 9.37.39 AM.png
202 KB View Download
trace_longjsconsolelayout.json.gz
1.2 MB Download
Description: Show this description

Comment 6 by atotic@chromium.org, May 22 2017

Description: Show this description

Comment 7 by atotic@chromium.org, May 22 2017

It is just as slow on FF. I suspect the code is doing something gnarly, but it is hard to tell by looking at minified. Debugging this minified is a pain.

The code does lots of DOM manipulation, and DOM property accesses. Without source, it is hard to narrow it down.

I find myself often breaking in the following code, but I do not think it is the sole cause of slowness.

ObjectType.js:
  if (filter !== null) {
      props = props.filter(prop => {
        if ((prop + '').toLowerCase().includes(filter)) {
          return true;
        }

        if ((value[prop] + '').toLowerCase().includes(filter)) {
          return true;
        }

        return false;
      });
    }

Comment 8 by e...@chromium.org, May 24 2017

Status: WontFix (was: Untriaged)
Without access to the unminified code and given that it is as slow in FF there really is't much we can do about it at this time.

Sign in to add a comment