Web Front End Performance Analysis--Tool article "Go"

Online website class:

Webpagetest

Description

Online Site performance evaluation website, address http://www.webpagetest.org/

Add:

In fact, this site is also an open source project, so support themselves to build an internal testing site

Showslow

Description

Showslow is the yslow data collection and display platform http://www.showslow.com/, it is an open source PHP project that can be used with Firefox 's yslow plugin,page speed plug-in or dynatrace Communication, collect the information sent by the plugin or program and focus on the display. You only need to make some settings in the dynatrace installation directory to automatically implement the upload results to the showslow Platform for archiving, analysis and monitoring.

Browser plug-in class:

FireBug

This needless to say, it can debug the page, you can record all the page access time, download resources and so on.

Page speed

Description

firebug -based Web page Optimization Evaluation tool, as well as Chrome -enabled plugins, because google the product.

Use:

Switch to the page Speed tab by opening the FF firebug or Chrome Developer Tool directly , browse a Web page and click Analysis, and after the analysis is done, you will be able to make a score on the rules and tell you which rules you didn't meet.

The rule of scoring rules :

Https://developers.google.com/speed/docs/best-practices/rules_intro  

The results of the analysis of several websites are as follows:

CN

Baidu.com 98 min

360buy.com 98 min

Taobao.com- min

dangdang.com- min

Add:

In fact, this is more like the code of the White Box test analysis tool, because it is based on a certain specification to detect the degree of optimization of the page, rather than the actual to listen to and filter the time spent on page access. Of course, the load time of a webpage and a lot of factors, such as speed, such as the content on the page, different Web site load time is certainly not the same, each with a rule to determine how a site should be how long load time, so this is just a best practice rules and recommended detection tools Another point is that if you want to see the details of the page's access time,firebug and Chrome 's developer tools are already there.

Speed Tracer

Description

Chrome -based plugins are also made by Google , a performance Recording and analysis tool for Web front-end pages, along with a rule and recommended evaluation.

Use:

https://developers.google.com/web-toolkit/speedtracer/get-started

Add:

This tool collects mostly resources or events that consume time, it records the loading process of a page in real time, and keeps track of all events, data can come out in terms of ease of use, and performance rules and recommendations can be analyzed on a specific end based on the timeline.

Yslow

Description

Based on the firebug Evaluation Analysis tool,yahoo production, and page speed Similar tool, will give the page scoring and optimization rules, At the same time will provide the page download resources statistical analysis function, also provides some small tools, such as JS run detection, image optimization tools, not conforming to the rules of the resources and so on. In general, The enhanced version of page speed.

Yslow Optimization Recommendations for the rule:

http://developer.yahoo.com/performance/rules.html  

Ratings for each website:

CN + +

Baidu.com 94 min

360buy.com- Score

Taobao.com minutes

dangdang.com

Standalone Program classes:

DynaTrace Ajax Edition

Description

plug-ins based on IE,Firefox , need version support for FF , need to install files separately ( more than M). It supports measurement analysis at the function level , in addition to the functionality supported by other tools.

DynaTrace Optimization recommendation rules:

http://community.dynatrace.com/ext/ajax/PUB/Best+Practices+on+Web+Site+Performance+Optimization

Fiddler

Description

a Microsoft Web Debugging tool that logs all local http traffic. also supports ie plugin version

Httpanalyzer

Description

The same tools as the Fiddler principle, but features are more usable than fiddler. At the same time support ie,ff plug-in version, in addition to the standalone version of the program to provide HTTP debugging capabilities, write HTTP-based communication programs using this debugging is good, before writing interface test tools used in this debugging.

HttpWatch:

Description

Before this and Httpanalyzer have used, and then only use the latter; Today suddenly found that the reason to abandon it is that it only supports plug-in version, that is, only in the browser, and can only catch the corresponding browser HTTP communication, and does not support the debugging of HTTP communication But now found a better than httpanalyzer is the statistical function of page load time, it is possible to count a page total time what, so this tool is more suitable for the site of the page performance analysis.

Summarize:

Some of these tools are similar, some are different, some specialize in Web Front-end performance evaluation tools, and some are not tools for Web front-end performance. In general, it is necessary to combine these tools with the actual situation, and what tools need to be analyzed. In the normal sense of the Web front-end performance test, you can choose a fixed scheme, such as:DynaTrace + Showslow, the former to obtain very rich data, the latter on the server dedicated to display the data, That is convenient to use and easy to store. If you want to support continuous testing, you can write automated scripts to run specific pages, each time a new version of the automated test will be performed.