Simple and other times in Chrome developer tools. Why has the browser been inactive for so long?

What is included in the "Idle" and "Other" times on the Sumary of Timeline tab in the Chrome developer tools?

enter image description here

What causes such inaction?

Why is this happening?

How to reduce these times? Is it possible?

Why has the browser been inactive for so long (in the context of downtime)?

At the beginning of more than 1.8 seconds, nothing happens:

enter image description here

In the middle, “Idle” and “Other” take about 0.3 seconds:

enter image description here

At the end of almost 3 seconds, nothing happens:

enter image description here

In this example, we have almost five seconds of inactivity browser ...

+5
source share
2 answers

Check out this section.

Idle is simple, nothing happens, so I have nothing to worry about as far as I know.

Another is a “toolless operation”. This is material that cannot be broken at this time. So, you cannot analyze what happens with DevTools there.

+1
source

I found part of the answer on the Addy Osmani blog :

In frame mode, the shaded vertical bars correspond to the recalculation of styles, compositions, etc. The transparent areas of each vertical bar correspond to downtime, at least unoccupied on part of your page. For example, let's say that your first frame takes 15 ms to complete, and the next 30 ms. The general situation is that the frames are synchronized with the refresh rate, and in this case, the second frame takes a little more than 15 ms for rendering. Here frame 3 missed the “true” hardware frame and was displayed on the next frame, therefore, the length of the second frame was effectively doubled.

But this does not exhaust the topic.

An example from which the diagram included in the question did not use frames.

I still don’t know how to reduce time, and what is hidden under the “other”.

0
source

Source: https://habr.com/ru/post/1259503/


All Articles