页面加载全过程

分为4个步骤:
1,当发送一个URL请求时,不管这个URL是Web页面的URL还是Web页面上每个资源的URL,浏览器都会开启一个线程来处理这个请求,同时在远程DNS服务器上启动一个DNS查询。这能使浏览器获得请求对应的IP地址
2,浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/IP连接。该握手包括一个同步报文,开一个同步-应答报文和一个应答报文,这三个报文在浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信,而后服务器应答并接受客户端的请求,最后由客户端发出该请求已经被接受的报文。
3,一旦TCP/IP连接建立,浏览器会通过该连接向远程服务器发送HTTP的GET请求。远程服务器找到资源并使用HTTP响应返回该资源,值为200的HTTP响应状态表示一个正确的响应。
4,此时,Web服务器提供资源服务,客户端开始下载资源。

详细过程:

1)        查找浏览器缓存

2)        DNS解析、查找该域名对应的IP地址、重定向(301)、发出第二个GET请求

3)        进行HTTP协议会话

4)        客户端发送报头(请求报头)

5)        服务器回馈报头(响应报头)

6)        html文档开始下载

7)        文档树建立,根据标记请求所需指定MIME类型的文件

8)        文件显示

哪些地方会出现css阻塞

执行 JavaScript 会阻止 DOM tree 构建

加载 CSS 会阻止 render tree 构建

哪些地方出现js阻塞(比如我使用window.οnlοad=出现一直不执行的现象)

当遇到以下情况时,DOM树的构建会被阻塞:

²  HTML的响应流被阻塞在了网络中

²  有未加载完的脚本

²  遇到了script节点,但是此时还有未加载完的样式文件

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值