I've spend evenings on tuning my backend code to be served faster, yet there's a gap in page loading time that am not familiar with.
Attached an image - please tell me what is happening in highlighted time (between recieving HTML and DOM ready).
What I think it is - maybe it's DOM intself generating? But why so long? Theres like 10 HTML tags in this testing page.
That's my markup:
<!DOCTYPE html>
<html lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>#</title>
<meta name="keywords" content="a, b">
<meta name="description" content="cde">
<meta name="geo.region" content="PL">
<meta name="geo.placename" content="Warszawa">
<meta name="geo.position" content="52;21">
<meta name="ICBM" content="52, 21">
<link rel="stylesheet" href="/Css/_global/Style.css">
<!--link rel="shortcut icon" href="/Gfx/_global/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="/Gfx/_global/favicon.gif" type="image/x-icon"-->
</head>
<body>
<ul id="bredcrumbs"><li>domain.com</li><li>Home Page</li></ul>
Content
</body>
</html>
The browser is parsing the dom (as warlock notes) but some javascript may run during this process as well. (See JavaScript: DOM load events, execution sequence, and $(document).ready())
As you have seen some browser plugins can essentially inject some scripts which run pre-dom load which may show up in your load times.