1. 程式人生 > >手機端網頁在速度上優化的方案

手機端網頁在速度上優化的方案

1.儘量減小首屏載入的資源

2.inline首屏必備的css和javascript

3.當出現多個li標籤需要進行迴圈判斷點選效果的時候,可以採用事件委託的方式大大提高效率,倘若每個li標籤的點選結果效果不同,可以採用swich,case的寫法實現;ie瀏覽器不相容ev.target,相容event.srcElement的寫法;用nodeName來獲取具體的標籤名,但nodename返回的是大寫的,我們需要用toLowerCase()函式來將其轉化為小寫;

當已經寫入標籤的移入移出效果,而後再加入標籤;(那麼後加入的標籤沒有被寫入前面縮寫的js效果)如果使用傳統的寫法即不使用事件委託來實現則會如此;當然可以將滑鼠移入移出封裝為一個函式,後面再呼叫,但這樣則增加了dom的操作;加入li標籤中所包含內標籤且標籤種類不同,則先判斷是否為ul。。。。

4.網頁的快取一般都是由http訊息頭中的Cache-control來控制的,常見的值有private、no-cache、max-age、must-revalidate根據不同的瀏覽方式可以做如下區分:

(1)重新整理頁面

無論值為什麼,都會重複訪問

(2)開啟新視窗

如果Cach-control的值為private、must-revalidate、no-cache,那麼開啟新視窗訪問時都會重新訪問伺服器,而如果設定了max-age值,那麼在此值對應的時間內不會重新訪問伺服器。

例如:Cache-control:max-age=3表示訪問此網頁3秒內再次訪問則不會去伺服器訪問。

(3)在位址列回車

  如果值為private或must-revalidate(和網上說的不一樣),則只有第一次訪問時會訪問伺服器,以後就不再訪問。如果值為no-cache,那麼每次都會訪問。如果值為max-age,則在過期之前不會重複訪問。

(4)回退

如果值為private、must-revalidate、max-age,則不會重複訪問,而如果為no-cache,則每次都重複訪問;如果為no-cache則無論以什麼方式開啟瀏覽器都會重新訪問伺服器。