1.输入网址按下回车到看到网页的过程
1.域名解析(看一下浏览器要和哪个服务器的哪个接口建立连接)
2.发起TCP三次握手
3.浏览器发起http请求
4.服务器响应http请求,返回html文件
5.浏览器解析html文件,并请求html中的资源
6.服务器端返回资源,浏览器对页面进行渲染呈现给客户*
2.TCP三次握手
一:浏览器向服务器端发送一个SYN码(同步序列码),数据项设为j,等待服务器确认
二:服务器接收到了SYN包之后,会将syn包的数据项修改为j+1形成一个确认包(ack包),但是服务器又想知道浏览器有
没有收到它发送的ack包,就会再同时发送一个SYN包让浏览器确认
三:浏览器收到了服务器发来的两个包之后,会将SYN包变成一个确认包(ack包)发给服务器端,服务器端收到后就能建立tcp连接了。
3.浏览器加载和渲染html的顺序
浏览器下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的但是遇到js脚本或者是外部css样式的时候,下载过程会启用新的连接进行下载,这个过程是同步的,意味着会停止之后元素的下载,阻塞文档的解析,当js文件解析完之后才会恢复文档解析。css样式表下载完之后会和之前的样式表一起解析,渲染之前的所有元素。
注:两种外部资源是阻塞脚本执行,从而阻塞渲染的。
js会阻塞文档的解析,因为浏览器需要一个稳定的DOM树结构,js代码可能会直接改变DOM树结构
js可能会使用到元素的样式,外部css样式不解析的话可能js文件会出错
解决阻塞:开发者可以将脚本标识为defer,以使其不阻塞文档解析,并在文档解析结束后执行。Html5增加了标记脚本为异步的选项,以使脚本的解析执行使用另一个线程。
现代浏览器的优化(预解析):执行脚本的时候开启一个新线程解析剩下的文档