Java Web High performance Development-front-end performance

IBM DeveloperWorks
Links: https://www.ibm.com/developerworks/cn/java/j-lo-javawebhiperf1/
Copyright belongs to the author. Commercial reprint please contact the author for authorization, non-commercial reprint please specify the source. image CompressionReduce the size of the picture, you can significantly improve performance, and for the existing picture, to reduce the size of the picture, can only change the format of the picture, it is recommended that the PNG8 format. image Merging implements CSS SpritesTo integrate some background images into a picture file, and then use the CSS "Background-image", "Background-repeat", "background-position" combination for background positioning, The background-position can be used to pinpoint the position of the background image with a number.

1. Reduce the number of HTTP requests for Web pages, improve the performance of the page, CSS sprites is the biggest advantage

2. Reduce the overall product of the picture, the volume of the merged picture is often less than the sum of the individual volume of these pictures

3. Solve the problem of image naming, convenient style replacement

multi-domain requestThe image data is divided into multiple domain names on the server, on the one hand, the server's request pressure on multiple hardware servers. On the other hand is to break through the browser's concurrent download limit, to achieve multi-image concurrent download. BASE64 encoding of imagesThe image data is encoded into a BASE64 string, using this string instead of the image address, so that the download of the picture does not need to make a request to the server, but can be downloaded to the local http://www.cnblogs.com/coco1s/p/4375774.html as the HTML download gzip CompressionThe HTTP protocol supports gzip compression format, and the server response header contains Content-encoding:gzip, which tells the browser that the return data of this response has been compressed into gzip format and the browser obtains the data after the decompression operation. http://www.jianshu.com/p/d864fa98216e lazy loading vs. Pre-loadingThe preload principle is that when a user views a picture, the next picture is downloaded to local, and when the user actually accesses the next picture, due to the local cache, there is no need to download from the server side, so as to achieve the purpose of improving the user experience. https://zhuanlan.zhihu.com/p/25455672 use of the flush mechanismThe idea of the flush mechanism is not to wait until the content of the Web page is fully loaded and write back to the client at once, but to return it partially. In Java Web technology, as long as you call the Flush method of the Httpservletresponse.getwriter output stream, you can write back the content that has already finished loading to the client. static and dynamic separationThe so-called dynamic separation is to put the static and dynamic content of the Web application on different Web servers, and to deal with dynamically and static content, so as to achieve the performance improvement. The common scenario is Nginx + Tomcat. https://lanjingling.github.io/2015/10/28/nginx-tomcat-cluster/ HTTP Persistent ConnectionPersistent connection (keep-alive) is also called a long connection, it is a TCP connection, the connection is cached by the browser and the server, the next time you connect to the same server, the cached connection is reused. Https://imququ.com/post/transfer-encoding-header-in-http.html

By

Default HAProxy operates in keep-alive mode with regards to persistent connections:for each connection it proces SES each request and response, and leaves the connection idle on both sides between the end of a response and the start of A new request. (Since version 1.5)

reasonable use of HTTP protocolUse cache-related HTTP headers such as If-modified-since, last-modified, 304 status codes, etc. using CDNA CDN is a computer network connected to the Internet that uses the closest server to each user to send music, pictures, videos, applications, and other files to users faster and more reliably to deliver high performance, scalability, and low-cost content to the user.

Java Web High performance Development-front-end performance