In chrome, why does DOMContentLoaded appear to take longer than the request/response itself?

Question

As you can see, the actual length of the request and its subsequent response is very quick. You cant see it in this view, but the blue bar represents a transaction that took 9 milliseconds.

The two lines, red and blue (which completed nearly instantaneously and are thus very close to each other), pictured far to the right of that, show up around 51ms.

So, what is happening here? is this actually time being spent? or is it just how the browser records it?

Answer 1

Your request took 9 milliseconds to complete
After that your browser received some data, it converted this into an html object(DOM) and displays this on your screen(DOMLoaded)
The action of converting and displaying took your browser 42 milliseconds, which is the gap between response and domLoaded.

edit:
I didn't manage to find the exact things the browser does but when i look into the dom of an empty page (which takes 100ms on my browser btw) i can find things like local storage, screen resolution, geo location and history.
Besides that i can imagine that cookie and add-ins can also take up some time if they are hooked.
My ghostery for example is ment to block trackers so i assume he does so before the page is fully loaded.
I wish i could have given you a list of things the browser does in that window but alas. Maybe someone else can provide an actual list.