前端讲义06__Fiddler优化页面经验,如何减少HTTP请求次数
当我们打开浏览器,在地址栏中输入URL,然后我们就看到了网页。
比如,
URL :http://gseip.ch.casetekcorp.com/gseip/
过程:实际上我们输入URL后,我们的浏览器给Web服务器发送了一个Request, Web服务器接到Request后进行处理,生成相应的Response,然后发送给浏览器, 浏览器解析Response中的HTML,这样我们就看到了网页。
加快这个页面显示,你得知道发送给浏览器有哪些内容(文件/图片等)及花费时间。
现在介绍一个工具Fiddler Web debugger
使用其统计报表得时间轴功能,可以了解到每个资源下载花费时间,其中部分时间更长,减少HTTP请求次数
我们主要优化这部分,如下图红框内所示。
PS,时间轴功能:每个网络请求都会经历域名解析、建立连接、发送请求、接受数据等阶段。把多个请求以时间作为 X 轴,用图表的形式展现出来,就形成了瀑布图。
请求条后面的图标表示响应的某些特征。如软盘图标表示这个响应正文从本地获得,也就是说服务端返回了 304;
举例
打开URL,浏览器显示的如下界面
其中传送的图片
红框内的图片可优化成一张背景图片,减少HTTP请求的次数,提高I/O性能。