从浏览器输入网址 ,点击回车,到页面渲染完毕,经过了一下几个步骤: 1.DNS 解析域名 (找到要去哪里) 2. TCP 三次握手 (找到服务器之后要交流下,征求下服务器意见) 3. 浏览器发出请求 (服务器同意之后,发送请求) 4. 服务器处理请求并返回页面信息 (服务器收到请求之后,把请求内容返回) 5. 浏览器解析渲染 (拿到返回内容,开始渲染页面)
想要了解具体内容,首先要了解tcp/ip 协议的构成
TCP/IP协议
tcp/ip(Transmission Control Protocol/Internet Protocol,传输控制协议/网际协议),是指能够在多个不同网络间实现信息传输的协议簇。tcp/ip协议不只是包含tcp和ip两个协议,而是包含了 FTP,SMTP,TCP,UDP, IP等协议。
tcp/ip协议 有四个层次组成 1.应用层 (直接为应用进程服务的) 2.传输层 (tcp和udp) 3.网络层 (网络连接的建立和终止,ip地址的寻找) 4.数据链路层 (对应网络接口和硬件)
发出请求时 从 应用层 到 数据链路层 接收请求时 从 数据链路层 到 应用层
DNS 域名解析
internet上的计算机都是通过IP来定位的,因为ip不容易记忆,所以衍生出域名来代替IP地址 , 我们通过这一步来获得IP地址。
解析的过程就是从域名的右侧 向左侧解析,依次是 根域,顶级域,二级域,子域,主机名
TCP三次握手
tcp三次握手,在客户端与服务器端建立联系的时候执行
第一次握手:建立连接时,客户端发送syn包(seq=j)到服务器,并进入SYN_SENT状态,等待服务器确认;SYN:同步序列编号(Synchronize Sequence Numbers)。 第二次握手:服务器收到syn包,必须确认客户端的SYN(ack=j+1),同时自己也发送一个syn包(seq=k),即SYN+ACK包,此时服务器进入SYN_RECV状态。 第三次握手:客户端收到服务器的SYN+ACK包,向服务器发送确认包ACK(ack=k+1),此包发送完毕,客户端和服务端进入ESTABLISHED(TCP连接成功)状态,完成三次握手。 完成三次握手,开始传输数据。
客户端发送请求
请求的几种方式:post,get,put,delete,head,patch,options,connect,trace
区别: post : 向指定资源提交数据进行处理请求(例如 提交表单或者上传文件)。数据被包含在请求体中。post请求可能会导致新的资源的建立,或者已有资源的修改
get :请求指定页面信息,并返回实体主体
put :从客户端向服务器端传送的数据取代指定的文档内容
head:类似于get请求,只不过返回中没有具体内容,用户获取报头
delete:请求服务器删除指定页面
connect:HTTP1.1协议中预留给能够将连接改为管道方式的代理服务器
options: 允许客户端查看服务器的性能
patch:是对PUT方法的补充,用来对已知资源进行局部更新
服务器处理请求并返回请求所需内容
客户端请求发出后,服务器会返回一个包含http状态码的信息头,用来响应浏览器的请求。
状态码: 1** :信息,服务器收到请求,需要请求者继续执行操作 2** :成功,操作成功接收并处理 3** :重定向,需要进一步操作以完成请求 4** :客户端错误,请求包含语法问题 5** :服务器错误,服务器在处理请求的过程中发生了错误
常见状态码 200 :请求成功 301 :资源被永久转移到其他url 404 :资源未找到 500 :服务器内部错误
浏览器接收并渲染页面
浏览器解析并渲染页面 ,有以下几个步骤: 1.创建 DOM树 HTML解析器解析出HTML元素,根据从上到下,从左到右的原 则,构建dom树 2.创建styleRules css解析器分析css文件,生成样式表 3.创建Render树 根据dom树和css样式表,生成render树 4.布局 浏览器根据render树布局,把每个树节点确定在浏览器上 5.paint 画元素 调用dom节点的paint方法,画出元素 6. 当render树上的节点的位置,属性发生变化时,会引起回流和重绘, 7. 当样式发生变化且不影响元素在页面中的位置时,会引起重绘
回流: 就是当render树上的节点的位置,属性发生变化时,浏览器绘制 页面的过程
重绘: 就是当样式发生变化且不影响元素在页面中的位置时,浏览器重新赋予元素新样式的过程
回流耗费的性能比重绘高,触发回流一定会触发重绘,到那时触发重绘,不一定会触发回流
才疏学浅,欢迎各路大神交流探讨 指导指正 ~ ~
|