DOMContentLoaded significa che il parser ha completato la conversione del HTML in nodi DOM ed eseguito qualsiasi script sincrone.
Ciò non impedisce al browser di visualizzare un albero DOM/CSSOM incompleto. In effetti, deve essere in grado di eseguire i reflows comunque nel caso in cui le query JavaScript abbiano le proprietà CSS calcolate. E se può fare i reflows su alberi incompleti, potrebbe anche renderli.
Questo è rilevante anche per i documenti di grandi dimensioni in streaming da un server. L'utente può già iniziare a leggerlo prima che abbia completato il caricamento.
È importante comprendere che l'intero processo di analisi/valutazione/rendering è una pipeline di elaborazione del flusso con alcune parti anche eseguite in parallelo/speculativamente. Le fasi successive della pipeline non attendono il completamento delle fasi precedenti, ma prendono le uscite non appena arrivano e le elaborano non appena sono disponibili informazioni sufficienti per effettuare l'incremento successivo.
E.g. il parser ovviamente non può emettere nodi Element prima di elaborare tutti i suoi attributi, ma può emettere il nodo mentre sta ancora elaborando il suo albero figlio. E il renderer può rendere il nodo senza i suoi figli. E può essere reso con gli stili incompleti solo per subire un reflow più tardi, ad es. quando javascript inserisce un altro foglio di stile o semplicemente perché i nodi figli che devono ancora essere inseriti influenzano il modo in cui sarà reso.
http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/#The_main_flow
E 'importante capire che questo è un processo graduale. Per una migliore esperienza utente, il motore di rendering proverà a visualizzare i contenuti di sullo schermo il prima possibile. Non attenderà fino a quando tutto il codice HTML viene analizzato prima di iniziare a creare e a tracciare l'albero di rendering. Le parti del contenuto verranno analizzate e visualizzate, mentre il processo continua con il resto dei contenuti che continuano a provenire dalla rete .
