前臺頁面速度優化標準

1. Css文件 

1.1 Css引用應該放在<head>標籤中,並保證每個頁面引用唯一的css 

1.2 避免1個頻道所有頁面公用1個css文件,以免發生公用class過多難以修改和刪除

造成的css不斷增大以及小頁面引用超大css的問題  

2. Javascript 

2.1 將js引用和執行放在頁面儘量靠下的位置 

2.2 Javascript函數、判斷、循環要封裝到js中,html中只允許簡單的函數調用 

2.3 Javascript代碼執行效率的優化(足夠優化的代碼執行速度和CPU使用能有10倍甚至

更高的降低) 

2.4 同一頁面,特定參數需要運行的js,只在特定參數的情況下運行 

 

3. Html 

3.1 儘可能的減少div嵌套,合理的應用dt dd li等元素 3.2 使整體的html代碼量儘量的小,在和同行業同頁面相比無特殊功能和區塊的情況下,

總字節數不可高於同行業同頁面的10% 3.3 巨大的包含數據的html(如產品下拉框),數據應封裝到js中減少html代碼量並充

分利用緩存 

3.4 雖然html要減少,但爲了SEO鏈接仍然要使用絕對路徑 3.5 儘量減少使用iframe 3.6 禁用ViewState 3.7 禁用asp.net控件 

 4. Cookie,由於Cookie會隨着每次http請求往返於服務器和客戶瀏覽器之間,增加網絡

流量開銷,降低網友訪問速度 4.1 Cookie要儘量少用。 

4.2 使用的時候要使Cookie儘量的小 

4.3 設定Cookie過期時間要儘量的短且合理 

4.4 將Cookie精準的寫在使用它的2級域名下,儘可能的不去寫根域的Cookie 

4.5 樣式、js、圖片等不需要Cookie的文件分離到不攜帶Cookie的域名上,如

ico.pcpop.com.cn  img.pcpop.com.cn 

 

5. 減少前臺http請求數量 

5.1 頁面http總請求數量不應高於最優競爭對手的同頁面的10% 

5.2 最大化的css sprite 合併樣式小圖,每頁面調用樣式圖片的總數不超過3個 5.3 儘量將零散的js合併,“頁面自用”的js總數控制在5個以內(1個jquery或其他工

具引用、1個公用js、1個頁面專用js、2個其他功能js) 

5.4 儘量減少頁面ajax的請求次數,將功能相近可以合併的ajax請求合併 

 

6. 緩存優化 

6.1 “所有可以緩存的資源”都必須在HttpHead中對過期時間進行設置 

6.2 Ajax要特別注意對是否可緩存的資源區分,可緩存的ajax請求的get參數中要加入

正確的時間戳以便CDN可以正確緩存 

6.3 不能緩存的ajax接口應從可被CDN緩存的域名中分離出來。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章