在url中输入地址到页面呈现发生了什么

查找ip地址

1. 根据url的域名去查找ip地址
2. 现在dns缓存中查找
3. dns缓存中查找不到在本机的hosts文中查找有无对应ip
4. hosts文件中没有,就去上级dns服务器中查找,知道找到根目录为止

tcp链接和http请求

1. http协议建立在tcp协议之上,所以要先建立tcp链接,就是我们的tcp三次握手,保证服务端和客户端可以稳定通信
2. 三次握手完成后,浏览器向服务器发送http请求
3. 服务器接受到请求,并将资源返回给浏览器
4. 资源在本地客户端下载并开始加载

html页面渲染

1. 客户端浏览器加载html文件后,从上到下开始构建dom树
2. 遇见css,css的url发起http请求,增加了Connection: keep-alive声明，故tcp连接不会关闭,可以复用
3. http重新发起请求-响应过程
4. 在css的请求过程中,解析器会继续解析html
5. 遇到script,由于script内容可能会影响dom,所以解析器停止dom树生成,解析器被js阻塞,等带js去发起http请求加载.并知道js加载-执行完成之后,才会去开启解析
6. JS 可以修改 DOM，如果在 JS 执行的时候 UI 线程还在工作，就可能导致不能安全的渲染 UI
7. 浏览器为保证css和js的顺序,规定必须等样式表加载解析完才去执行js
8. css解析生成css规则树
9. 在规则树生成后,执行“布局”给每个节点计算位置坐标,“布局”完成后执行“绘制”渲染引擎去遍历css规则树完成页面的渲染和显示
10. 为了保证页面能尽快的呈现出来,并不会等到整个html的dom树都构建完成才开始执行渲染,而是边变解析边渲染
11. 在这一步中涉及到了回流和重绘
12. 知道遇到html结束标签,页面渲染才算完成