一、減少操作量

    1. 儘量減少 HTTP 請求

• 合併檔案，比如把多個 CSS 檔案合成一個； 
• CSS Sprites 利用 CSS background 相關元素進行背景圖絕對定位； 

    2. 不要在 HTML 中使用縮放圖片

• 縮放圖片並沒有減少圖片的容量，只是控制了圖片的大小。

    3. Image壓縮

• 使用工具對圖片進行壓縮，保證質量的同時減少了圖片的大小。

    4. 減少對DOM的操作

• 減少對DOM的操作，減少頁面的重繪。

二、提前做載入操作     1. 對域名進行預解析         例如京東的做法         <link rel="dns-prefetch" href="//misc.360buyimg.com" />       2. 預載入元件或延遲載入元件

• 把 CSS 放到內碼表上端 

    3. CSS 放到最頂部，瀏覽器能夠有針對性的對 HTML 頁面從頂到下進行解析和渲染。     4. 使用 new Image物件，對圖片進行快取

三、提升並行載入     切分元件到多個域 ，提升伺服器的響應能力

四、JavaScript和CSS優化     1. 從頁面中剝離 JavaScript 與 CSS

• 剝離後，能夠有針對性的對其進行單獨的處理策略，比如壓縮或者快取策略。

    2. 精簡 JavaScript 與 CSS 

• 使用工具壓縮JavaScript和CSS檔案

    3. 指令碼放到 HTML 內碼表底部

• 減少對頁面的阻塞。

五、非同步載入   使用Ajax實現非同步載入，例如，滾動頁面載入後面的內容，這種也比較常見。

---------------------  原文：https://blog.csdn.net/lxcao/article/details/52948324