最近一段时间再做页面的性能优化，很多朋友在做性能优化的时候只知道跟踪SQL，然后找到SQL性能差的进行优化，当然这也是办法之一，但影响web加载速度的原因很多，数据库联接只是其中的一部分，想真正优化页面还是要从页面的每一次请求进行分析，甚至一张图片的大小都是我们优化的节点。
HttpWatch强大的网页数据分析工具，通过它，我们可以观察每一次请求的轨迹，还有网页摘要、Cookies管理、缓存管理、消息头发送/接受，字符查询，POST 数据等页面深层信息。
下面我们简单介绍它的实用，安装完成后，在ie工具中可以找到它的开关，打开后出现在浏览器的下方，如图1：
（图1）
点击“record”按钮开始录制请求轨迹。
图2就是所有请求明细
（图2）
从上图中可以看出每一次请求的地址、请求开始的时间（相对时间）、花费的时间、请求类型、请求状态、请求方式等。
从timeChart，我们可以一目了然的看到那些请求花费的时间较长，一般柱状的长短表示从请求到接受共花费的时间，我们重点需要优化那些柱状较长的部分，当然我们也可以点击time列，按请求时间排到序，直接找出请求时间最长的部分。
针对每一条柱状图，又分为好几个部分，用不同颜色表示。这些颜色表示不同的时间段。举例说明，我们点击一条明细，在下方会出现该条请求的所有详细信息。我们点击TimeChart的Tab页。
这是一个google广告的请求，分为5部分，依次如下：
白色：空白时间，0.001s，表示页面刷新后0.001s才开始这个请求。
绿色：请求发送时间，也是0.001秒
红色：等待时间，这个影响因素较多，网络、数据库查询等等。
青色：请求接收，这条请求结果只返回了304的请求状态，所以时间很短，上图几乎看不到。
蓝色：从浏览器缓冲中读取，因为返回304，表示该文件最后更新日期没有发生改变，所以从缓存中读取该文件。
在图2的明细表中还有几个指标需要我们注意，一个是received和result，表示请求接受的大小和状态。举例说明，在上面的例子中我们找到分别在0.272s和0.892s两次请求jquery文件：
-----------------------------------------------------------------------------
Start received result url
0.272 15981 200 http://10.5.22.52/EKP/jquery.js
0.892 91 304 http://10.5.22.52/EKP/jquery.js
两次请求有什么不同，第一次200请求成功请求，所以接受的数据大小为js的大小15.9K，第二次304，只返回一个状态，表示该文件最后更新时间没有改变，文件可以从浏览器缓存中取得。从这也可以看出在ie中点刷新和在地址栏打回车并不一样，点刷新素有文件都会像服务器发送请求，只是如果文件被缓存，只返回304状态，在地址栏打回车时，缓存的内容不会像服务器发送请求，直接从缓存中获取，httpwatch中result中显示为(cache)。当然点击每一条明细，也可以在下面的详细信息中查看是否被缓存，如何缓存，过期时间、健等信息。
还有其他信息，如cookies、queryString等信息，这里就不一一列举，大家多使用使用就熟悉了。
PDF下载
|
