Page Speed的安装及使用

一、Page Speed的安装及使用

Page Speed是一款Firefox插件，同时他依附于别款插件Firebug，也就是说你的Firefox浏览器中必须已经安装了Firebug才能安装Page Speed。安装环境为Firefox 3.0.4以上，Fireug 1.3.3以上。

Page Speed的使用也很简单，在Firefox中点击右下角的Firebug图标启动后，再点击Page Speed选项卡即可。要注意的是，你要对你网站内的某个页面进行性能分析，你必须先把该页面加载完成后才能使用Page Speed，也就是说只有在浏览器左下角出现“Done”或者"完成"之后才可以启用Page Speed进行分析。如果页面中流媒体，可能不会现在“完成”，这种情况要等到流媒体可以播放。

page speed启动界面

然后点击“Analyze Performance”（性能分析），这时Page Speed会根据web performance best practices （网页性能最佳实践）进行逐项打分。然后根据重要程序和优先级对每项进行排列。

Page Speed运行界面

此外，你还可以点击每条建议前面的“加号”展开查看详细的描述，或者直接点击每条规则相看该规则的具体内容，还可以点击“Show Resource”（查看来源）来查看每条建议是针对页面中哪部分内容提出的。

对于分析结果中的符号说明一下：

   1. 红色感叹号代表高优先级提示，表示这一项严重影响了你的页面性能，你需要优先对其进行性能优化；
   2. 橙色三角代表此项提示需要引起你的注意，并进行适当改进；
   3. 绿色的对号代表该项规则在你的网站中应用得到，你在修改了前面两部分的提示之后，它们有可能变为绿色的对号；
   4. 蓝色消息符号是为你提供了额外的帮助信息，请稍加留意（需要注意的是，如果你的页面中出现了大量的此类符号，可能是因为你在页面加载完成之前就进行了网站性能分析）。
二、活动记录

活动记录是一条页面活动的时间轴，它记录了包括网络事件、JavaScript运行在内的所有浏览器活动。你可以使用它并配合性能分析中的数据进一步对网站性能做出评估。

    * 查看页面运行过程中所耗费的时间，以毫秒计算；
    * 查看浏览器事件，包括页面加载完成后的事件；
    * 区分造成页面响应缓慢的原因，其中包括网络来时、DNS查找、连接建立、JavaScript运行等；
    * 获取在特定时间或者事件下才响应的JavaScript事件列表；
    * 可以对其它标签或者窗口中打开的页面进行分析；
    * 多页面加载时的页面加载顺序；
    * 对根据Page Speed优化前后的表现进行对比。

Page Speed 页面活动记录
三、理解Page Speed中的事件

页面记录选项卡下是通过时间线来记录各种资源加载到页面所有需要的时间。事件的记录时间间隔为10毫秒，如果事件需要的时间少于10毫秒那么它将用较短的色块来表示。时间线中没有任何颜色的表示，在浏览器事件的运行依赖于其它进程，如DOM和CSS渲染、Flash ActionScript、渲染、操作系统事件等。
网络事件 描述

此外，Page Speed还包括了对已完成的JavaScript函数的信息搜集功能，当页面中的JS函数一旦运行，PageSpeed就会捕捉到相关信息。不通过对Page Speed进行设置还可以对未触发函数、延时加载函数等进行收集。

下面的图片显示了7800毫秒时已经加载但还未触发的函数列表：

Page Speed活动记录——JS收集

而下面则显示是已经触发运行了的JS函数：

Page Speed

此外Pge Speed还有诸如JavaScript函数控制、浏览器User Agent设置等更高级功能。具体使用大家可以与YSlow对比一下