web前端優化方法

 

 目前，互聯網BS模式應用發展愈來愈多，愈來愈普遍，包括網站系統、OA平臺的開發等，那麼如何作好、作得出色，給用戶帶來很好的體驗呢？下面跟你們分享一下Web前端優化方面的經驗，這些經驗都是工做實踐中比較實用的技術.

　　一、儘可能減小HTTP請求個數——須權衡

　　合併圖片（如css sprites，內置圖片使用數據）、合併CSS、JS，這一點很重要，可是要考慮合併後的文件體積。

　　二、爲文件頭指定Expires或Cache-Control，使內容具備緩存性。

　　區分靜態內容和動態內容，避免之後頁面訪問中沒必要要的HTTP請求。

　　三、避免空的src和href

　　留意具備這兩個屬性的標籤如link，script，img，iframe等；

　　四、使用gzip壓縮內容

　　Gzip壓縮全部可能的文件類型以來減小文件體積

　　五、把CSS放到頂部

　　實現頁面有秩序地加載，這對於擁有較多內容的頁面和網速較慢的用戶來講更爲重要，同時，HTML規範清楚指出樣式表要放包含在頁面的區域內；

　　六、把JS放到底部

　　HTTP/1.1 規範建議，瀏覽器每一個主機名的並行下載內容不超過兩個，而問題在於腳本阻止了頁面的平行下載，即使是主機名不相同

　　七、避免使用CSS表達式

　　頁面顯示和縮放，滾動、乃至移動鼠標時，CSS表達式的計算頻率是咱們要關注的。能夠考慮一次性的表達式或者使用事件句柄來代替CSS表達式。

　　八、將CSS和JS放到外部文件中

　　咱們須要權衡內置代碼帶來的HTTP請求減小與經過使用外部文件進行緩存帶來的好處的折中點。

　　九、精簡CSS和JS

　　目的就是減小下載的文件體積，可考慮壓縮工具JSMin和YUI Compressor。

　　十、剔除重複的JS和CSS

　　重複調用腳本，除了增長額外的HTTP請求外，屢次運算也會浪費時間。在IE和Firefox中無論腳本是否可緩存，它們都存在重複運算JavaScript的問題