The performance.timing
stores the timing of the various events' that happen during the webpage loading:
(source: dvcs.w3.org)
And I learned that HTML tags get parsed and <script>
elements with neither 'defer' nor 'async' attribute get executed synchronously between domLoading
and domInteractive
, and then scripts with 'defer' attribute(i.e., scripts in list of scripts that will execute when the document has finished parsing) get executed before DOMContentLoaded
. And then execute <script>
element with async
attribute, if there is any, before document.readyState
is set to complete
and load
event fired on the Window object.
Spin the event loop until the set of scripts that will execute as soon as possible and the list of scripts that will execute in order as soon as possible are empty.
My question is when the webpage contents get displayed? Are they displayed at the same time when HTML tags are parsed? or in the scripts execute phase? or after loadEventEnd
?
When load a large page, the loading icon still spins for a while after the page get displayed, Is the browser executing scripts during this time?
HTML pages are displayed incrementally. Display starts at the point when domInteractive
happens (at which point typically not all the content is present yet), and continues after that point, in general.