performancegoogle-chromegoogle-chrome-devtoolstimelinedeveloper-tools

Idle and Other times in Chrome Developer Tools. Why the browser is inactivity for so long?


What is included in "Idle" and "Other" times into Sumary of Timeline tab in Chrome Developer Tools?

enter image description here

What causes so much inaction?

Why do these occur?

How to reduce these times? Is it possible?

Why the browser is inactivity for so long (in the context of idle time)?

At the beginning of more than 1.8 seconds nothing happens:

enter image description here

In the middle the "Idle" and the "Other" occupy 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...


Solution

  • The "Idle" state occurs when the browser has not yet completed the final rendering of the page on the screen but must put the process on hold while waiting for missing data or resources needed to resume and complete it.

    We can deal with long "Idle" periods, for example, when the browser waits for a synchronous response, which is generated for a long time on the server-side.

    The "Idle" state should not be confused with the "Loading" state, which is the time the browser actually uploads the response (from the first to the last byte), not the time from sending the request to uploading the response.

    The "Other" state represents the time of all browser activities other than those listed in the pie chart, such as DOM tree building, CSSOM and others.

    This issue is partly explained on the "Render-tree Construction, Layout, and Paint" website.