從Web前端優化網站效能
1. 減少HTTP請求數
一個完整的請求都需要經過DNS存址、與伺服器建立連線、傳送資料、等待伺服器響應、接收資料這樣一個漫長而複雜的過程。資源上由於每個請求都要攜帶資料，因此每個請求都需要佔用頻寬。另外，由於瀏覽器進行併發請求的請求數是有上限的，因此請求數多了以後，瀏覽器需要分批進行請求，因此會增加使用者的等待時間，會給使用者造成站點速度慢這樣一個印象，即使可能使用者能看到的第一屏的資源都已經請求完了，但是瀏覽器的進度條會一直存在。
減少HTTP請求數的主要途徑包括：
（1）從設計實現層面簡化頁面
如果你的頁面想百度首頁那樣簡單，那麼接下來的規則基本上都用不著了。
（2）合理設定HTTP快取
快取可以大大減少第二次訪問時的請求數，但是如果是F5重新整理的話，請求數一樣。
怎樣才算合理設定？能快取越多越好，能快取越久越好。例如，很少變化的圖片資源可以直接通過HTTP Header中的Expires設定一個很長的過期頭；變化不頻繁而又可能會變的資源可以使用Last-Modified來做請求驗證。儘可能的讓資源能夠在快取中待得更久。
（3）資源合併與壓縮
如果可以的話，儘可能的將外部的指令碼、樣本進行合併，多個合為一個。另外，CSS、JavaScript、Image都可以用相應的工具進行壓縮，壓縮後往往能省下不少空間。
（4）CSS Sprites
合併CSS圖片，減少請求數的有一個好辦法。
（5）Inline Images
使用data：URL scheme的方式將圖片嵌入到頁面或者CSS中，如果不考慮資源管理上的問題，不失為一個好辦法。如果是嵌入頁面的話換來的是增大頁面的體積，而無法利用瀏覽器快取。使用在CSS中的圖片更為理想一些。
（6）Lazy Load Images
使頁面剛載入的時候只加載第一屏，當用戶繼續往後滾屏的時候才載入後續的圖片。
2. 將css檔案放在head頭，JS指令碼放在頁面資訊後面
外鏈指令碼會在載入時阻塞其他資源。
3. 非同步執行inline指令碼（保證指令碼在頁面內容後面載入）
inline指令碼在執行的時候一樣會阻塞併發請求。除此之外，由於瀏覽器在頁面處理方面是單執行緒的，當inline指令碼在頁面渲染之前執行時，頁面的渲染工作則會被推遲。
因此，建議將執行時間較長的inline指令碼進行非同步執行，例如使用setTimeout或者HTML5中的Web Worker。
4. Lazy Load JavaScript
（1）利用min版JS框架
（2）YUI，最初只加載核心模組，其他模組可以等到需要使用的時候才載入。
5. 將CSS放在Head中
使頁面在開始渲染之前先載入css資源
6. 非同步請求callback
7. 減少不必要的HTTP挑轉
8. 避免重複的資源請求
9. 合併CSS屬性值
如border-style: solid;
border-width:1px;
border-color:red;
變成border: 1px solid red;