1: Create a Document object and start parsing web pages, parsing their html elements and their text content. This stage document.readyState='loading'.
2: When encountering link external CSS, create a new thread to load, and continue to parse the document.
3: When encountering script external js, and not setting async and defer, then the browser is blocked from loading. After the js file is loaded, continue to load the document.
4: When encountering script external js, set async, defer, the browser creates a new thread to load this file, and continues to parse this document, and executes after async is loaded, and defer needs to wait for the document to be parsed before executing . At this time, it is forbidden to use the document.write() method to overwrite the page.
5: When encountering img, etc., first parse the dom structure, then start a new thread to asynchronously load src, and continue to parse the document.
6: When the document is parsed. document.readyState='interactive';
7: When the document ends, execute the script with defer set one at a time in order.
8: The document object triggers the DOMContentLoaded event. Marks that the program becomes an event-driven phase.
9: When all defers are loaded and executed, and img is loaded, document.readyState='loaded'. window triggers the load object.
10: Handle user input asynchronously, network events.