Fourteen golden rules for high-performance websites

Many studies have shown that the most satisfactory time for users to open a webpage is less than 2 seconds. The longest waiting period that the user can endure, in the range of 6 ~ Between 8 seconds. That is to say, 8 seconds is a critical value. If your website is opened for more than 8 seconds, most visitors will eventually leave you.

Google has performed a test. It takes 0.4 seconds to load 10 search results and 0.9 seconds to load 30 search results, as a result, Google's total traffic and revenue were reduced by 20%.

Amazon's statistics also show similar results. The website sales volume is reduced by 100 every 1% milliseconds after the homepage is opened.

It can be seen that the speed at which a Web page is opened is very important for a webmaster, especially for-profit websites. However, from entering the web site to opening the web page, what happened between the browser and the server during this period? Where is the time consumed?

Yahoo lab research shows that for most websites, less than 10%-20% of the response time is spent in downloading HTML documents from Web servers to browsers. Where is the other 80%-90% time consumed?

Steve Souders, former chief Performance Expert of Yahoo! and founder of yslow, the famous web performance analysis company, wrote High Performance Web sites. uncover the secrets of another 80%-90%. In the book, Souders briefly proposed 14 golden rules on the performance of the Web Front-end. As follows:

1. Make fewer HTTP requests (minimize HTTP requests)
2. Use a content delivery network (using the content delivery network (CDN )). I wrote an article earlierArticleTo introduce the use of the CDN network. See "using Microsoft Ajax Content Delivery Network (CDN) to optimize WordPress loading speed ".
3. Add an Expires header (add an Expires header)
4. Gzip components (compression component)
5. Put stylesheets at the top (put CSS at the top of HTML)
6. Put scripts to the bottom (put the script (such as JavaScript) at the bottom of HTML)
7. Avoid CSS expressions (avoid using CSS expressions)
8. Make JavaScript and CSS external (using external JavaScript and CSS)
9. Reduce DNS lookups (Reduce DNS queries)
10. Minify JavaScript (simplified JavaScript)
11. Avoid redirects (avoid redirection)
12. Remove duplicate scripts (delete duplicateCode)
13. Configure etags (configure etag)
14. Make Ajax cacheable (use Ajax cache)

Expanded from 14 golden rules, each of which is a learning tree. After reading and learning, it is easy to understand. These fourteen golden rules let you understand the principles of front-end optimization and have a clear target direction when you do it on your own. At the same time, from this book, I realized that in addition to standard XHTML, CSS, and JavaScript, a good web development engineer should also have several other skills:

1. Proficient in working principles of browsers and differences between different browsers
2. Understand the HTTP protocol
3. Master Server programming
4. Understand network environment Configuration

As a developer, you cannot meet the needs of implementation, but must enter a better implementation. It is not a concise operation guide, but a thorough introduction to internal principles! Therefore, I plan to write an introduction to each principle and a practice log. CDN practices have been released some time ago. Please refer to "using Microsoft Ajax Content Delivery Network (CDN) to optimize WordPress loading speed ".

Note:

1. I have translated the fourteen golden rules by myself. My translation skills are limited. If there are any errors, please leave a correct message. Thank you!

References

• Baidu Encyclopedia: Content Delivery Network
• Psychology of webpage opening speed
• Google's experiment (Wall x required)
• Some texts refer to the book reviews of several people
  • Pony
  • Xingmao monkey
  • Jie

Note:

This article is also published on my personal blog, digua. For more information, see the author and original website.
Sweet potato: http://www.diguage.com/archives/34.html
Blog: http://www.cnblogs.com/diguage/archive/2012/07/24/2605913.html