注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

网易杭州 QA Team

务实 专注 分享 做有态度的QA

 
 
 
 
 

日志

 
 

搭建自动化前端性能测试平台  

来自Hou_BW   2013-02-27 17:36:06|  分类: 性能测试 |举报 |字号 订阅

  下载LOFTER 我的照片书  |

showslow网站(www.showslow.com)有这么一张图(如图1),从这张图中我们可以得到很多信息:通过Overrall Rank(Page Speed)我们可以猜测网站的版本更新时间,这次更新可能因为一些新增的功能使得性能提升,如Nov.23处拐点,或者因为一些功能的增加使得性能变差,如12.1处拐点,同样可以看出,1210号左右,网站首页增加了一些新请求,在1.1号后的某一天,请求数又减少了。这种汇总,使得我们对网页的性能有了很明晰的了解,那么这种统计数据我们可以自己测试、自己收集、自己监控么?

我们的前端性能测试方案:

实现第一步:环境以及工具准备工作

1. 部署自己的ShowSlow平台,ShowSlow平台是一套开源工具,是基于Apache+Mysql+Php实现的,我们搭

ShowSlow台 http://qa.hz.netease.com/showslow?nav=111

2. 在测试客户端安装FirefoxFirebugYslowPagespeedDynatrace相关工具

3. 配置Yslow等参数,使其可以自动把测试数据上传到ShowSlow平台上

实现第二步:Selenium RC实现UI自动化

使用selenium RC实现一个UI页面的自动化用例。

public static void main(String args[]) {

                    Selenium selenium = new DefaultSelenium("localhost", 4444, "*iexplore", "http://www.google.com");

                    selenium.start();

                    selenium.open(http://www.google.com);     

                    selenium.stop();

}

实现第三步:Selenium集成Dynatrace性能分析

使用dynaTrace免费版,通过配置环境变量来实现自动化。设置Selenium 脚本开始启动浏览器时自动连接上 dynaTracedynaTrace 会自动收集数据;设置脚步执行完成后,dynatrace会自动把数据上传到showslow平台上:

1. 设置selenium server启动参数,实现seleniumdynatrace结合:

@echo off

set SELENIUM_RC=

{jar包地址}\selenium-server-standalone-2.25.0.jar

set SCRIPT_PATH=%~dp0

rem IE agent settings

set DT_AE_AGENTACTIVE=true

set DT_AE_AGENTNAME=dynaTrace_Selenium

set DT_AE_CLEARCACHE=true

java -jar %SELENIUM_RC%

2.  设置dynatrace启动时参数,实现dynatrace测试数据自动上传到showslow平台:

-Dcom.dynatrace.diagnostics.ajax.beacon.uploadurl=http://qa.hz.netease.com/showslow/beacon/dynatrace/

-Dcom.dynatrace.diagnostics.ajax.beacon.portalurl=http://qa.hz.netease.com/showslow

-Dcom.dynatrace.diagnostics.ajax.beacon.autoupload=true

实现第四步: Selenium集成Yslow性能分析

使用WebDriver实现UI自动化,在启动Firefox时,设置FirefoxProperty,启动Yslow并自动上传测试数据到ShowSlow,代码示例如下:

// Set default Firefox preferences

profile.setPreference("app.update.enabled", false);

String fireBugdomain = "extensions.firebug.";

String yslowDomain = "extensions.yslow.";

// Set default Firebug preferencesYslow是基于Firebug插件的

profile.setPreference(fireBugdomain + "currentVersion", "1.10.3");

profile.setPreference(fireBugdomain + "allPagesActivation", "on");

profile.setPreference(fireBugdomain + "defaultPanelName", "Yslow");

profile.setPreference(fireBugdomain + "net.enableSites", true);

// Set default Yslow preferences

profile.setPreference(yslowDomain + "beaconUrl", "http://qa.hz.netease.com/showslow/beacon/yslow/");

profile.setPreference(yslowDomain + "beaconInfo", "grade");

profile.setPreference(yslowDomain + "optinBeacon", "true");

profile.setPreference(yslowDomain + "autorun", "true");//自动上传showslow平台

实现第五步:ShowSlow平台数据统计结果

ShowSlow平台用来收集页面性能测试工具的测试结果,并对测试结果进行分析展示。可以收集的工具包含YslowpageSpeeddynaTrace以及NetExportWebPageTest等。配置相关配置参数,该工具会自动以JSON-Beacon的形式上传到ShowSlow平台,存储到相关数据库表中。PHP页面会从数据库表中获得数据展示在页面中,下图是YslowDynatrace的测试结果展示:



         感兴趣的话,大家都来尝试使用吧~


  评论这张
 
阅读(1697)| 评论(2)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2016