1、 減少http請求，合理設置 HTTP緩存
http協議是無狀態的應用層協議，意味着每次http請求都需要建立通信鏈路、進行數據傳輸，而在服務器端，每個http都需要啟動獨立的線程去處理。這些通信和服務的開銷都很昂貴，減少http請求的數目可有效提高訪問性能。減少http的主要手段是合並CSS、合並javascript、合並圖片。將瀏覽器一次訪問需要的javascript和CSS合並成一個文件，這樣瀏覽器就只需要一次請求。圖片也可以合並，多張圖片合並成一張，如果每張圖片都有不同的超鏈接，可通過CSS偏移響應鼠標點擊操作，構造不同的URL。
① 簡單的圖片效果可以使用html+css、canvas或者svg來替換。
② 合並CSS、合並javascript、合並圖片（webPack等包管理工具）
③ 圖片格式，大小選擇，圖片優化
2、 應用瀏覽器緩存：
① http緩存（文件級緩存）
<meta http-equiv="Cache-Control" content="max-age=7200" />
<meta http-equiv="Expires" content="Mon, 20 Jul 2013 23:00:00 GMT" />
② cookie: 儲存在用戶本地終端上的數據(通常經過加密)有長度和個數限制，瀏覽器端也可以通過document.cookie來獲取cookie，並通過js瀏覽器端也可以方便地讀取/設置cookie的值。
③ localStorage: localStorage是html5的一種新的本地緩存方案，目前用的比較多，一般用來存儲ajax返回的數據，加快下次頁面打開時的渲染速度。localstorage大小有限制，不適合存放過多的數據，如果數據存放超過最大限制會報錯，並移除最先保存的數據。localStorage存數的數據是不能跨瀏覽器共用的，一個瀏覽器只能讀取各自瀏覽器的數據
localStorage核心API:
localStorage.setItem(key, value) //設置記錄
localStorage.getItem(key) //獲取記錄
localStorage.removeItem(key) //刪除該域名下單條記錄
localStorage.clear() //刪除該域名下所有記錄
注：localStorage對象的屬性值只能是字符串，json對象可以根據當然也可以借助JSON類，將對象轉換成字符串保存，然后在取出來的時候將json字符串轉換成真正可用的json對象格式。
④ sessionstorage：
sessionStorage和localstorage類似，但是瀏覽器關閉則會全部刪除，api和localstorage相同，實際項目中使用較少。
⑤ application cache
application cahce是將大部分圖片資源、js、css等靜態資源放在manifest文件配置中。當頁面打開時通過manifest文件來讀取本地文件或是請求服務器文件。
3、啟用壓縮
在服務器端對文件進行壓縮，在瀏覽器端對文件解壓縮，可有效減少通信傳輸的數據量。如果可以的話，盡可能的將外部的腳本、樣式進行合並，多個合為一個。文本文件的壓縮效率可達到80%以上，因此HTML、CSS、javascript文件啟用GZip壓縮可達到較好的效果。但是壓縮對服務器和瀏覽器產生一定的壓力，在通信帶寬良好，而服務器資源不足的情況下要權衡考慮。采用網上在線壓縮工具（jQuery MiniUI）自己壓縮或者通過webpack、gulp等打包工具進行壓縮處理。
4、CSS Sprites
5、LazyLoad Images：對於圖片而言，在頁面剛加載的時候可以只加載第一屏，當用戶繼續往后滾屏的時候才加載后續的圖片。
①jqueryLazyload方式
②echo.js方式
6、CSS放在頁面最上部，javascript放在頁面最下面
后續文章還會具體講各種優化方法，希望大家一起學習~