This article describes how to use some simple tools to analyze some data related to site performance. In the previous article, we discussed the general process of performance tuning, this article introduces some methods and tools to help you get started quickly.
The topics in this chapter are as follows:
General performance tuning process
Analyze page loading information using analysis tools
Analyze performance bottlenecks using analysis tools
Analyze and load page information using analysis tools
After all, the optimization of the site is the optimization of every page of the site, even if the page of the site is displayed to the user's eyes faster. So before that, let's take a look at the components of a web page:
1. html file: in ASP. NET, HTML files are usually generated by parsing the. ASPX page. This parsing process is performed on the server and consumes most of the server's resources.
2. Images and Flash files: A website usually contains many such files.
3. js and CSS files: these files can prevent page rendering.
After understanding the components of the page, we can classify the factors that slow the page loading into the following categories:
1. The server spends a lot of time parsing. aspx, that is to say, it takes too long for the server to generate HTML text (there are many reasons for this problem, such as the slow database query, affecting page generation ).
2. It takes a lot of time to pass HTML text between the server and the browser (for example, the viewstate in the page is large and the network is slow ).
3. It takes a lot of time to load images and Flash files.
4. Loading JS and CSS takes a lot of time.
To make the loading of a page faster, we need to know which of the above processes affects the speed (this series of subsequent articles will be detailed ). Once we know that this type of problem causes performance problems, we can take the right remedy.
Next we will use some tools to simply view and analyze the performance of the site, so that you can quickly learn how to perform simple performance analysis.
The waterfall chart is used to analyze the loading time of each part of the page. For example, the following figure shows the analysis graph (partial) loaded on the homepage of the blog garden ).
We can know the loading time of each file through the "timeline" in the figure. The longer the timeline, the longer the file will be loaded.
After reading the above figure, you should be very curious about how the above figure is generated. The following describes some tools for generating a page to load a waterfall chart.
Let's first take a look: Firefox + firebug
Firefox: http://www.mozilla.com/en-US/firefox/
Firebug: http://getfirebug.com/
The following describes how to generate a waterfall chart for page loading (skip this section if you are familiar with this process)
1. Open Firefox and press F12 to see the following picture:
2. In firebug, select "enable" in the select "network" drop-down box ".
OK. Let's take a detailed look at some data and the meaning of the illustration in the waterfall diagram.
1.Request and Response Information
In the waterfall chart, click "+" for each row as follows:
After the symbol is expanded, we can see all the request and response headers, as shown below:
2.Timeline Information
When we move the mouse over the colored timeline bar, we can see the detailed information of the time spent requesting the file, as shown below:
We use a table to describe the meaning of each time period:
Domain name resolution |
Time taken to find the IP address of the server where the requested file is located |
Establish a connection |
Time taken to open the TCP link from the client to the server |
Send request |
The time taken by the browser to send the request. It may be a bit strange: Why is the request still waiting? Didn't the request be sent when the connection is opened? In fact, the browser will put the request for the file to be requested in the Request queue, the queue length is generally limited, if the page needs to request a lot of files, if the maximum number of queues is reached, subsequent file requests will wait. |
Wait for response |
The time taken by the client to send a request until the first byte of the server is accepted. |
Accept data |
Time taken to accept the entire request file or data |
'Domainloaded'Event |
The time it takes to start DNS addressing from the request to download the DOM of the entire page. Note: At this time, the skeleton of the page is downloaded, and some resources (such as images and JS files) are not downloaded. After the DOM of the page is downloaded, the user can see the page, but some resources are still being downloaded. |
'Load' event |
The time it takes to start DNS addressing from this request to download all (including resources) on the entire page. |
3.Page-level request information
That is, some summary information of the requests on the whole page.
From: http://www.cnblogs.com/yanyangtian/archive/2011/02/10/1950493.html