性能黃金法則
　　只有10%–20%的較終用戶時間花在了下載HTML文檔上，其余的80%~90%的時間花在了下載頁面中的所有組件上。
　　關(guān)注前端可以很好的提高整體性能
　　改進(jìn)前段通常只需要較少的時間和資源
　　規(guī)則1 減少HTTP請求
　　由于上面的”性能黃金法則”，我們必須減少用戶下載html文檔的時間，較基本的一個方法是必須減少http請求，包括image，css和js文件。
　　規(guī)則2 使用CDN
　　什么是CDN?
　　一組分布在多個不同地理位置的Web服務(wù)器用于更有效的向用戶發(fā)布內(nèi)容。
　　如果應(yīng)用程序的web服務(wù)器離用戶更近，則1個http請求的響應(yīng)時間將縮短;如果組件web服務(wù)器離用戶更近，則多個http請求的響應(yīng)時間將縮短。
　　同時，我們需要關(guān)注CDN Cache.例如修改了某個js文件，需要及時清除CDN Cache,甚至?xí)霈F(xiàn)不同步的情況。
　　規(guī)則3 添加Expires頭
　　Expires: Thu, 15 Apr 2010 20:00:00 GMT
　　Cache-Control: max-age=315360000
　　Expires的局限：需要服務(wù)器和客戶端的時鐘嚴(yán)格同步，所以我們可以使用cache-control來控制。
　　@import 規(guī)則必須放在所有其他規(guī)則之前，而且會導(dǎo)致組件下載的無序性
　　規(guī)則5 將樣式表放在頂部
　　這個規(guī)則其實(shí)并不影響性能，但是卻關(guān)乎用戶的體驗(yàn)。
　　如果樣式表放在頂部，那么在下列三種情況下，瀏覽器會出現(xiàn)白屏
　　1、在新窗口中打開
　　2、重新加載
　　3、作為主頁
　　@import 規(guī)則必須放在所有其他規(guī)則之前，而且會導(dǎo)致組件下載的無序性。
　　規(guī)則6 將腳本放在底部
　　規(guī)則7 避免CSS表達(dá)式
　　規(guī)則8 使用外部的Javascript和CSS
　　頁面中盡量使用外部的js和css文件，雖然會帶來額外的http請求訪問時間，但是因?yàn)榫彺鏅C(jī)制會節(jié)省后期訪問時http的請求。
　　特殊情況：主頁。在主頁中盡量將js和css寫在頁面中，這樣會節(jié)省主頁的訪問時間。
　　兩全其美的方式
　　1、加載后下載
　　在主頁加載外幣之后，動態(tài)加載js和css文件。例如我們的loadJs和loadCss方法。
　　2、動態(tài)內(nèi)聯(lián)
　　可以使用例如cookie的方法，如果js加載過，則寫入cookie一個值;動態(tài)檢測cookie的值，如果不存在則加載，如果存在則跳出加載過程。
　　規(guī)則9 減少DNS查找
　　DNS查找可以被緩存起來以提高性能，通過Keep-Alive和較少的域名來減少DNS查找。
　　規(guī)則10 精簡Javascript
　　精簡：從代碼中移除不必要的字符以減少其大小，進(jìn)而改善加載時間。移除所有的注釋和不必要的空白字符
　　混淆：除了精簡，還將函數(shù)和變量的名字轉(zhuǎn)換為更短的字符串。
　　規(guī)則11 避免重定向
　　在下列幾種情況下可能會發(fā)生
　　1. 缺少結(jié)尾的斜線
　　2. 連接網(wǎng)站
　　3. 跟蹤內(nèi)部流量
　　4. 跟蹤出站流量
　　5. 美化URL
　　規(guī)則12 移除重復(fù)的腳本
　　規(guī)則13 配置Etag(Entity Tag)
　　Etag是Web服務(wù)器和瀏覽器用于確認(rèn)緩存組件的有效性的一種機(jī)制,是 標(biāo)識了一個組件的一個特定版本的字符串.
　　GET /i/yahoo.gif HTTP1.1
　　Host: us.yimg.com
　　HTTP 1.1 200 OK
　　Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT
　　Etag: “a531782d768ca1:dcc”
　　Content-Length：1195
　　GET /i/yahoo.gif HTTP 1.1
　　Host: us.yimg.com
　　If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT
　　If-None-Match: “a531782d768ca1:dcc”
　　HTTP 1.1 304 Not Modified
　　問題：通常使用組件的某些屬性來構(gòu)造它，這些屬性對以特定的、寄宿了網(wǎng)站服務(wù)器來說是 的。另一臺不同的服務(wù)器發(fā)起請求，是不會匹配的。
　　規(guī)則14 使Ajax可緩存
　　被動請求(Passive Request)
　　主動請求(Acitve Request)
　　筆者舉了一個yahoo! mail的例子,當(dāng)用戶登錄的時候，主動的ajax請求前三封郵件的內(nèi)容并緩存起來，這種做法稱作主動請求.