Chrome浏览器开发者工具Network窗口下,可以查看下载各组件所需的具体时间

根据上表进行简要分析——

Stalled(阻塞)

  浏览器对同一个主机域名的并发连接数有限制,因此如果当前的连接数已经超过上限,那么其余请求就会被阻塞,等待新的可用连接;此外脚本也会阻塞其他组件的下载;

  优化措施:

  1、将资源合理分布到多台主机上,可以提高并发数,但是增加并行下载数量也会增大开销,这取决于带宽和CPU速度,过多的并行下载会降低性能;

  2、脚本置于页面底部;

DNS Lookup(域名解析)

  请求某域名下的资源,浏览器需要先通过DNS解析器得到该域名服务器的IP地址。在DNS查找完成之前,浏览器不能从主机名那里下载到任何东西。

  优化措施:

  1、利用DNS缓存(设置TTL时间);

  2、利用Connection:keep-alive特性建立持久连接,可以在当前连接上进行多个请求,无需再进行域名解析;

Initial connection(初始化连接)

  TCP建立连接的三次握手时间

SSL(包含于HTTPS连接中)

  http是超文本传输协议,以明文方式发送内容,不提供任何方式的数据加密,如果被不法分子截取浏览器和服务器之间的传输报文,会获取其中的信息。

  https 是安全套接字层超文本传输协议,就是在HTTP的基础上加入了SSL协议,SSL依靠证书来验证服务器的身份,并为浏览器和服务器之间的通信加密。

  因此建立HTTPS连接的时间相当于三次握手的时间+SSL时间。

Request sent(发送请求)

  发送HTTP请求的时间(从第一个bit到最后一个bit)

  优化措施:

  1、减少HTTP请求,可以使用CSS Sprites、内联图片、合并脚本和样式表等;

  2、对不常变化的组件添加长久的Expires头(相当于设置久远的过期时间),在后续的页面浏览中可以避免不必要的HTTP请求;

Waiting(等待响应)

  通常是耗费时间最长的。从发送请求到收到响应之间的空隙,会受到线路、服务器距离等因素的影响。

  优化措施:

  1、使用CDN,将用户的访问指向距离最近的工作正常的缓存服务器上,由缓存服务器直接响应用户请求,提高响应速度;

Content Download(下载)

  下载HTTP响应的时间(包含头部和响应体)

  优化措施:

  1、通过条件Get请求,对比If-Modified-Since和Last-Modified时间,确定是否使用缓存中的组件,服务器会返回“304 Not Modified”状态码,减小响应的大小;

  2、移除重复脚本,精简和压缩代码,如借助自动化构建工具grunt、gulp等;

  3、压缩响应内容,服务器端启用gzip压缩,可以减少下载时间;

转载至:http://www.cnblogs.com/zhenwen/p/5827925.html

Chrome浏览器Network面板http请求时间分析的更多相关文章

  1. chrome浏览器Network面板请求Timing分析

    Timing显示资源在整个请求生命周期过程中各部分话费的时间. Queueing 排队的时间花费.可能由于该请求被渲染引擎认为是优先级比较低的资源(图片).服务器不可用.超过浏览器并发请求的最大连接数 ...

  2. chrome浏览器network面板出现:Provisional headers are shown 提示

    一般来说,如果看到这个提示,说明这个请求并没有发送出去. 具体原因有多种: 请求被某些扩展如 Adblock 拦截了 请求被墙了 走本地缓存或者 dataurl 的请求 client发送请求后,由于各 ...

  3. 谷歌chrome浏览器network中Stalled分析和优化

    谷歌chrome浏览器network中Stalled分析和优化 问题由来 最近项目上要求首页的加载速度,查看浏览器的network发现接口加载速度非常慢. 问题解决思路 SSL 网上有人因为图片加载, ...

  4. Web协议详解与抓包实战:HTTP1协议-如何用Chrome的Network面板分析HTTP报文(1)

    一.Chrome 抓包:Network 面板 1. Network 面板 • 控制器:控制面板的外观与功能 • 过滤器:过滤请求列表中显示的资源 • 按住 Command (Mac)或 Ctrl (W ...

  5. Chrome浏览器允许跨域请求配置

    最近有个做数据标注的任务,但是标注平台是别人公司的,他们又不愿意对平台进行升级改造: 其实要改的地方也很简单,就是对页面做一些处理,做一些脚本控制. 没办法,做了个 iframe 给她嵌入到我们自己的 ...

  6. 通过chrome浏览器分析网页加载时间

    今天趁着下班的时间看了下chrome浏览器的网页加载时间分析工具和相关文档,简单写点儿东西记录一下. 以百度首页加载为例,分析下一张图片1.jgp(就是背景图)的加载时间 看右侧的Timing标签,从 ...

  7. Chrome教程之NetWork面板分析网络请求

    官方文档:https://developers.google.com/web/tools/chrome-devtools/network/ 最近打算写一写Chrome教程文档,不知道大家最感兴趣的是什 ...

  8. Chrome教程(一)NetWork面板分析网络请求

    官方文档:https://developers.google.com/web/tools/chrome-devtools/network/ 1.如何打开 无论是在Windows还是Mac,都可以使用( ...

  9. Chrome DevTools — Network -- 转载

    转载地址:https://segmentfault.com/a/1190000008407729 记录网络请求 默认情况下,只要DevTools在开启状态,DevTools会记录所有的网络请求,当然, ...

随机推荐

  1. Java数组在内存中是如何存放的

    阅读目录 一维数组 二维数组 数组对象及其引用存放在内存中的哪里? Java中有两种类型的数组: 基本数据类型数组: 对象数组: 当一个对象使用关键字“new”创建时,会在堆上分配内存空间,然后返回对 ...

  2. Python基础语法(二)

    类中的方法定义前如果有 @staticmethod 则此方法通过类名调用,如:dict.fromkeys() : 如果没有,则此方法通过对象调用 三元运算 name=值1 if 条件 else 值2  ...

  3. python字符串的编码格式

    参考网站: http://www.cnblogs.com/siqi/archive/2012/11/10/2763598.html 环境: win7 x64 python v2.7.10 结论: 1 ...

  4. 利用sp_addlinkedserver实现远程数据库链接

    --查看当前链接情况: select * from sys.servers; --使用 sp_helpserver 来显示可用的服务器 Exec sp_helpserver --删除已经存在的某个链接 ...

  5. fdfdfdfdfdfdfdfdfdfdfd

    len := Length( Face[integer(FaceType)][Line-1] );  SetLength( Face[integer(FaceType)][Line-1], Len+1 ...

  6. linux svn 用户配置

    1:创建存放仓库的目录 mkdir -p /home/svn/ 2:创建svn仓库 svnadmin create /home/svn/evansource 3:配置仓库(一共三个文件夹auzhz.p ...

  7. 安装了多个Oracle11g的客户端,哪个客户端的tnsnames.ora会起作用?

    如果我们由于需要安装了多个Oracle的client,哪个客户端的tnsnames.ora会起作用呢? 答案是: 在安装好clinent端后,安装程序会把client的bin目录放到path里面,pa ...

  8. java后台访问接口

    // 发送url地址获取信息 public static String sendPost(String jsonStr, String path) { String msg = "" ...

  9. Robot Framework:RF中对时间操作的datetime库常用关键字

    [转自:http://blog.csdn.net/r455678/article/details/52993765] 1.对固定日期进行操作,增加或减去单位时间或者时间段 2.对两个时间段进行操作 3 ...

  10. c++ 类的静态变量

    类的静态变量作为类的一部分,但不由类的创建产生,类的销毁而消失.静态变量和全局变量一样,会在main函数结束后销毁. 类可以对静态变量的值进行改变 #pragma once class ctest { ...