共计 687 个字符，预计需要花费 2 分钟才能阅读完成。
由前文内容浏览器工作原理与事件循环引出的问题：当咱们的页面足够简单，足够大时，如何使页面更快展现内容呢？当初在本文来做一次抛砖引玉。若有其余加载优化，心愿评论区不吝赐教。
首先，咱们须要先理解的是浏览器网络过程和渲染过程。（具体内容参照文章：浏览器是如何渲染页面的？）接下来，我会依据每一个渲染阶段提出能够优化的内容。
一. 解析 HTML 阶段
解析 HTML 阶段，浏览器可能会遇到须要加载内部资源的 script 标签与 link 标签。浏览器会通过网络过程去加载 JS，CSS 等内部资源，若 JS 资源较大，加载工夫过长可能会导致因期待资源而无奈持续解析 HTML。（解析 CSS 生成 CSSOM 树不会扭转 DOM 树，所以 HTML 解析不会阻塞，解析 JS 也不会扭转 DOM 树，然而执行 JS 可能会改 DOM 树和 CSSOM 树，所以 CSSOM 树解析好后才会执行 JS。因而 JS 会阻塞 HTML 解析，CSS 不会阻塞但可能因 JS 而暂停 HTML 解析。）
解析程序图如下：
因而，为了尽可能避免 HTML 解析被阻塞，咱们须要人为干预浏览器的默认操作。我临时能想到的就是两个方面：
- 异步加载 (defer、async、module) 和预加载(preload、prefetch、dns-prefetch、preconnect、prerender)。
- HTTP2 里申请的多路复用。
1. 异步加载和预加载
应用异步加载是在 script 标签上减少对应字段。如下图所示：
依据上图，咱们能够晓得以下信息：
1. 默认状况下，HTML 解析的过程中，如果遇到 script 脚本，就会进行页面的解析进行下载，当脚本都执行结束后，才会持续解析页面。
正文完
