Web front end Performance Test dot

Articles about front-end performance:

Http://www.cnblogs.com/fnng/archive/2011/09/19/2181894.html

The front-end performance response time for Web apps refers to the browser's page load time. The page load time of the browser includes parsing the HTML, acquiring and loading files such as page pictures and CSS, execution time of the client script, and the time spent on displaying your page. This is not directly related to the size of the concurrent user, the main concern: how to improve the browser download and execution of resource concurrency, how to let the browser start rendering the page as soon as possible, how to make the browser as full use of the cache. In Yahoo, fewer than 50 teams have reduced end-user response time by more than 25% by using purely front-end performance-related techniques.

When we understand the Web front-end performance, we should know the HTTP protocol.

The HTTP protocol uses the request/response model, the client sends a request to the server, the request header contains the requested method, the URI, the protocol version, and so on, the server responds with a status line, which includes the version of the message protocol, the success or error encoding plus the information that contains the server, entity meta information, and so on. The protocol is a non-connection-oriented protocol, and each HTTP request is independent.

Format of Request message: Request Line | General Information Header | Request Headers | Solid Head | Message body Method Request-uri Http-versioncrif

Format of response message: status line | General Information Header | Response Headers | Solid Head | Message body

The status code of the response message is as follows:

1XX: Information response class, indicating receipt of request and continuation of processing

2XX: Handle the Success response class, indicating that the action was successfully received, understood, and received

3XX: Redirect Response class, indicating that further processing must be received in order to complete the specified action

4XX: Client error indicating that the client request contains a syntax error or does not execute correctly

5XX: Service-side error, indicating that the server is not performing a correct request correctly

header information related to front-end performance:

1, accept-encoding: Tell the server to accept the encoding of the page, gzip compression using gzip, deflate do not compress, compression can reduce the time required to download.

2, Connection: Because HTTP is a fee-oriented, stateless protocol, each HTTP request goes through the process of "make a connection-request a page or resource-get a resource-disconnect". For small resources, it is possible to establish a connection time that exceeds the processing time for the resource, and in order to reduce the time it introduces a persistent connection. When the browser and server are contracted, when a resource is transferred, it is not immediately disconnected, but instead waits for a period of time during which the connection is reused if other resources are transferred, otherwise it is closed. There is a persistent connection when the value is keep-alive.

3. Expires: The expiry time for returning data only. Before the expiration time, the corresponding resource is obtained directly from the cache before the request is sent to the server.

ways to improve front-end performance:

1, reduce the page load time,

2. Reduce network time: CDN Technology, DNS cache technology, reduce file size

3. Reduce the amount of requests sent: using browser caching

4, let the page start to show early

understanding of previous performance tests:

Because I have two or three months of contact with the front end, for the front-end knowledge points are familiar, in this respect is not very difficult to understand, for the HTTP protocol, the user response to the request process is familiar, but at that time did not take into account the page loading time problem, just want to render the page, The requirement for response time is ignored. Because they are all in this machine, so every time you want to see the results will have to wait for a long time, this is not the use of performance ideas, to reduce the loading time of the page, not considered comprehensive. Now we have a deeper understanding of this.

Web front end Performance Test dot