New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 765569 link

Starred by 1 user

Issue metadata

Status: Duplicate
Merged: issue 760738
Owner: ----
Closed: Sep 2017
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 2
Type: Bug-Regression

Blocking:
issue 760738



Sign in to add a comment

Elements inspect laggy and unresponsive

Reported by t...@ethercreative.co.uk, Sep 15 2017

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.79 Safari/537.36

Steps to reproduce the problem:
1. Visit any website
2. Open Devtools Elements inspector
3. Start hovering elements to highlight them on the page

What is the expected behavior?
The hovered element should be instantly highlighted on the page.

What went wrong?
There is a noticeable delay anywhere up to 1s before the element is highlighted on the page. The faster you hover between elements, the more delayed the highlighting gets, sometimes hanging on a previously highlighted element until you stop moving the mouse to let it catch up. All other sections in devtools work fine. Expanding DOM elements to show children is fine for the most part, but can start lagging when it is struggling to highlight. Resizing the window is also very laggy, but only when devtools is open.

Did this work before? Yes 59

Chrome version: 61.0.3163.79  Channel: stable
OS Version: OS X 10.12.6
Flash Version: 

It seems to be related to screen size. The larger the screen, the laggier the highlighting. This issue is consistent across 3 separate iMacs (5k retina, 27-inch, late 2015, one with 24gb ram) and a MacBook Pro (retina, mid-2012).
 
Cc: pnangunoori@chromium.org
Labels: Needs-Triage-M61 Needs-Feedback
Tested on reported Chrome version #61.0.3163.79, latest Stable #61.0.3163.91 and latest Canary #63.0.3218.0 on Mac 10.12.6 on MacBook Retina, MacBook Pro and MacBook Air and unable to reproduce the issue mentioned even after trying for more than 10 minutes. Please refer the screencast attached.

@tam -- Could you please try by removing the extensions and creating a new profile to verify if the issue still persists. You can also try by updating your Chrome to latest Stable version.

Please let us know if we have missed anything.
 
Thanks in advance.
765569.mp4
5.9 MB View Download
@pnangunoori Thanks for getting back to me. 

I've done some tests (removed extensions & created a new profile as you suggested), and I think I've found the culprit. Rulers. Enabling rulers in devtools completely tanks performance, with them disabled everything runs smoothly.

I've attached the version info from my main profile in Chrome. Let me know if you need any more info!
Screen Shot 2017-09-18 at 12.50.04.png
437 KB View Download
Project Member

Comment 3 by sheriffbot@chromium.org, Sep 18 2017

Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "pnangunoori@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Blocking: 760738
Cc: junov@chromium.org
Components: Blink>Canvas
Cc: krajshree@chromium.org
Labels: Needs-Feedback
Unable to reproduce the issue in MacBook Pro (Retina, 15-inch, Mid 2014), 10.12.6 using chrome stable version #61.0.3163.91 and latest canary #63.0.3220.0.

Following are the steps followed to reproduce the issue.
------------
1. Visited www.facebook.com and www.yahoo.com
2. Opened Devtools Elements inspector and enabled rulers from settings in devtools.
3. Started hovering elements to highlight them on the page.
4. Observed that hovered element instantly got highlighted on the page without any delay.

Attached screen cast for reference.

Reporter@ - Could you please verify the screen cast and please let us know if anything missed from our side.
Requesting dev from Blink>Canvas team to please have a look into the issue.

Thanks...!!
765569.mp4
11.0 MB View Download
I've attached two screencasts. 

The first is with rulers enabled / disabled, showing inspecting and expanding elements.

The second is resizing the window with inspect open / closed, showing very delayed re-renders (probably the wrong term, but you'll see what I mean) of the page. This is with rulers disabled, so I assume they're more of a symptom rather than the cause.
LaggyInspect.mp4
3.0 MB View Download
LaggyResize.mp4
6.2 MB View Download
Project Member

Comment 7 by sheriffbot@chromium.org, Sep 20 2017

Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "krajshree@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Cc: susanjuniab@chromium.org
Re-tried the issue again on Mac 10.12.6 on the latest Canary 63.0.3221.0 and latest Stable 61.0.3163.91 and unable to reproduce the issue.

Can someone from Blink>Canvas team please look into this issue and help in further triaging.

Thanks..

Comment 9 by junov@chromium.org, Sep 25 2017

Mergedinto: 760738
Status: Duplicate (was: Unconfirmed)
Repro requires a divice with a non-sRGB color profile (most Macs), lag is especially perceptible on machines with a devicePixelRatio > 1 (e.g. Retina display)

This is fixed in Chrome 62 (currently in beta)

Sign in to add a comment