Rule 1: Make Fewer HTTP Requests
These techniques include using image maps, CSS sprites,inline images, and combined scripts and stylesheets.Using these techniques reduces response times of the example pages by as much as 50%.
疑问：image maps 可用性高吗？没有css sprites 灵活吧？ inline images 用的也不多了
Rule 2: Use a Content Delivery Network
If the application web servers are closer to the user, the response time of one HTTPrequest is improved.On the other hand, if the component web servers are closer tothe user, the response times of many HTTP requests are improved.Rather than startingwith the difficult task of redesigning your application in order to disperse the application web servers, it’s better to first disperse the component web servers.This not only achieves a bigger reduction in response times, it’s also easier thanks to content delivery networks.
In addition to improved response times, CDNs bring other benefits.Their services include backups, extended storage capacity, and caching.A CDN can also help absorb spikes in traffic, for example, during times of peak weather or financial news,or during popular sporting or entertainment events.
Rule 3: Add an Expires Header
A future Expires header is most often used with images, but it should be used on all components, including scripts, stylesheets, and Flash.Most
Using Cache-Control with max-age overcomes the limitations of Expires
Rule 4: Gzip Components4
Many web sites gzip their HTML documents.It’s also worthwhile to gzip your scripts and stylesheets, but many web sites miss this opportunity (in fact, it’s worthwhile to compress any text response including XML and JSON, but the focus here is on scripts and stylesheets since they’re the most prevalent).Image and PDF files should not be gzipped because they are already compressed.
Rule 5: Put Stylesheets at the Top 5
The problem with putting stylesheets near the bottom of the document is that it prohibits progressive rendering in many browsers.Browsers block rendering to avoid having to redraw elements of the page if their styles change.Rule 5 has less to do
with the actual time to load the page’s components and more to do with how the browser reacts to the order of those components.In fact, the page that feels slower is ironically the page that loads the visible components faster.The browser delays showing any visible components while it and the user wait for the stylesheet at the bottom.The examples in the following section demonstrate this phenomenon,which I call the “blank white screen.”
Rule 6: Put Scripts at the Bottom
Parallel Downloads 并行下载
The explanation goes back to the HTTP/1.1 specification, which suggests that browsers download two components in parallel per hostname (http://www.w3.org/Protocols/rfc2616/rfc2616-sec8.html#sec8.1.4).Many web pages download all their
components from a single hostname.Viewing these HTTP requests reveals a stairstep pattern, as shown in Figure 6-1.
Scripts Block Downloads 脚本阻塞下载
Rule 7: Avoid CSS Expressions7
background-color: expression( (new Date()).getHours( )%2 ? “#B8D4FF” : “#F08A00” );
Rule 9: Reduce DNS Lookups9
Reduce DNS lookups by using Keep-Alive and fewer domains.
Rule 11: Avoid Redirects
1、Missing Trailing Slash 缺少结尾的斜杠
2、Tracking Outbound Traffic 跟踪外部流量
Rule 12: Remove Duplicate Scripts 12
Rule 13: Configure ETags 配置ETags
Conditional GET Requests
Rule 14: Make Ajax Cacheable 14