1、減少HTTP請求

（1）雪碧圖（CSS Sprites）
就是把多張圖合到一張圖裡面，然後通過CSS來分別取用。這樣就可以減少請求數量。

（2）合併多個指令碼和樣式表
但這種方式有一個弊端，對於只想訪問該網站的某一兩個頁面的人群來說，反而增大了下載量。

（3）合理設定快取
可以在下次訪問時減少部分請求，直接在快取中讀取。

（4）懶載入（Lazy Load）
只加載可見的部分。
先將img標籤中的src連結設為同一張圖片（空白圖片），將其真正的圖片地址儲存再img標籤的自定義屬性中（比如data-src）。當js監聽到該圖片元素進入可視視窗時，即將自定義屬性中的地址儲存到src屬性中，達到懶載入的效果。

2、減少對DOM節點的操作

操作DOM節點時會引發重繪和迴流，非常消耗效能。所以我們要儘量合併多次操作。

3、將JS指令碼置底

JS的下載會阻止後面DOM樹的構建，所以JS程式碼會截斷首屏內容。

4、將樣式表放在頭部

如果把CSS放在body，瀏覽器還未解析樣式就開始渲染，使用者體驗會很差。

5、使用CDN加速

CDN內容分發網路，是一組分佈在多個不同地理位置的伺服器，存放一些靜態檔案。當用戶請求伺服器時，伺服器會根據使用者地點為其分配最近的CDN以減少傳輸時間。

6、精簡CSS選擇器路徑

瀏覽器對選擇符的解析是從右往左進行的。

7、較小的圖片可以轉化為base64格式來顯示

對於較小的圖片，可以轉化為base64格式寫到JS或CSS檔案中以減少HTTP請求。

8、不要濫用float

float的佈局計算比較消耗效能。推薦使用固定佈局或彈性佈局。

9、預載入

對於一些大型遊戲頁面等可以增加一個loading頁面，等待資源載入完畢再顯示主頁面。