前端性能調優小結

前端頁面性能調優較經常使用的工具備 Yslow 和 Page Speed（google），小編以Yslow工具作下前端性能調優小結：
安裝Yslow要先安裝 Firebug（以火狐爲例），打開Firebug窗口，選擇Yslow選項。
點擊 Run Test 運行Yslow。

調優方法以下：

1. Make fewer HTTP requests：儘可能使用少的http請求，好比把多個js，css進行合併
2. Use a CDN：儘可能使用cdn，減小網絡訪問路徑
3. Add an Expires header：設置過時的HTTP Header。
4. Put CSS at the top ：把CSS放到頁面的頂部
5. Put JS at the bottom： 把Javascript腳本儘可能放到頁面底部加載。
6. Gzip components ：對咱們的頁面內容進行Gzip格式的壓縮，減小文件傳輸的字節數。
7. Reduce DNS lookups ：儘量少的DNS查找。
8. Avoid CSS expressions ：避免CSS表達式，該項影響性能。
9. Avoid redirects：儘可能 避免重定向（跳轉），重定向雖然處於安全考慮，可是重定向多了，勢必影響性能。
10. Minify JS ：對Javascript代碼進行壓縮，一樣是減小文件傳輸的字節數。
11. Remove duplicate scripts  ：去除重複的腳本，這點不用解釋了吧。
12. Make AJAX cacheable：對ajax請求加上緩存，避免重複的ajax請求影響性能。
13. Reduce the number of DOM elements：減小DOM元素數量。
14. Make JS and CSS external：將CSS和JS使用外部的獨立文件。
15. Avoid HTTP 404 (Not Found) error：避免404錯誤頁（非搜索結果）。
16. Reduce the number of DOM elements：減小DOM元素數量
17. Avoid AlphaImageLoader filter：避免過濾器的使用
18. Do not scale images in HTML：不要在HTML中縮放圖片。
19. Make favicon small and cacheable：壓縮favicon. ico的體積並緩，雖然 ico存儲不大，可是能壓縮減小傳輸大小也是好的。
20. 還有兩項不是重點: Configure ETags 和 Reduce cookie size，能夠參考進行優化一下。