js加载时间线

1、首先创建Document对象，开始解析web页面。解析HTML元 素和他们的文本内容，然后添加Element元素Text节点到文档中。这个阶段document.readyStyle=“loadng”
2、遇到外部引入的css，创建线程加载，并继续解析文档。
3、遇到script标签，如果没有设置Async、defer。浏览器加载，并阻塞，等待js加载完成然后执行该脚本，然后继续解析文档。
4、遇到script外部js，并且设置有async、defer属性，浏览器创建线程加载、并继续解析文档。对于async属性的脚本，加载完成后立即执行。
5、越到img等标签时，先正常解析dom结构，然后浏览器异步加载src，并继续解析文档
6、当文档解析完成后,document.readyStyle = “interactive”

7、文档解析完成后，所有设置defer脚本加载并执行完成后、8、document对象触发DOMContentLoaded事件，这也标志着程序从同步脚本阶段转发为事件驱动阶段
9、所有async的脚本加载完成并执行后、img等加载完成后，document.readyStyle=“complete”。window触发onload事件
10、页面步入异步响应式处理异步IO，网络请求等