(1)浏览器解析
(2)查询缓存
(3)DNS查询
顺序如下,若其中一步成功直接进去建立连接部分:
-- 浏览器自身DNS
-- 操作系统DNS
-- 本地hosts文件
-- 像域名服务器发送请求
(4)建立连接
-- TCP三次握手(three-way handshaking)
-- 发送方: SYN(synchonize)
-- 接受方: SYN/ACK(acknowledgement), 确认信息传达
-- 发送方: ACK - 确认接受方再线可收消息,握手结束
Accept
-- 1, 发送端: 标有SYN的数据包发给你了
-- 2, 接收端: 明白了! 我收到你给我发的数据包了! (并发送标有SYN/ACK的数据包了)
-- 3, 明白! (发送标有ACK的数据包)
TCP三次握手的好处在于,发送方可以确认接受方仍然在线,不会因为白发送而浪费资源.
(5) 发送HTTP请求
-- 报文首部(GET/index.html HTTP/1.1)
-- 方法
-- URL
-- HTTP版本
-- 空行
-- 报文主体
注意: 1,HTTP是无连接, 无状态的,即HTTP再传输完成后就会断开,并且下一次登陆时不会记录上次的登陆状态
2,关于CR(Carriage Return, 回车)和LF(Line Feed, 换行)
Dos和Windows采用的CR/LF表示下一行 UNIX/Linux采用LF表示下一行 MAC OS系统采用CR表示下一行
(6)服务器发送响应
-- 报文首部(HTTP/1.1 200 ok)
-- HTTP版本
-- 响应状态码
-- 状态码信息
-- 空行(CR+LF)
-- 报文主体
(7)客户端收到页面
(8)解析HTML
-- 构建DOM树
-- 下载资源
-- CSS - 构建CSSSOM树
-- js - 等下载并执行后解析
(9)构建渲染树
根据DOM和CSSSOM树渲染,不可见元素不被会渲染
(10)浏览器布局渲染
-- 布局- 根据渲染书布局
-- 绘制 - 在屏幕上绘制每个点