移動web app開發-----application cache 離線緩存(進階)
通過上麵的兩篇文章,application cache的應用和原理,我們應該能夠全麵了解application cache了。同時我們也能夠清楚application cache在設計上有哪些不盡仁義的地方。這篇文章我們主要來了解下application cache在各個瀏覽器的
支持情況和存儲大小,以及有哪些坑爹的地方,以及如何解決這些坑爹的地方。
- app cache在存儲大小的限製
- safari桌麵版沒有限製【包括mac和windows】
- safari移動版有10M的限製
- chrome桌麵版有5M的限製
- android瀏覽器沒有限製
- firefox桌麵版沒有限製
- Opera可以手動管理,默認限製大小為50M
- 瀏覽器支持情況
- safari從版本4開始支持
- chrome從版本5開始
- safari移動版從iOS2.1開始支持
- firefox從版本3.5開始支持
- opera從版本11開始支持
- android從版本2.1開始支持
- ie目前全麵不支持,包括ie10
- 我們知道application cache會把瀏覽器第一次輸出的動態資源也進行緩存起來,那麼我們如何解決這個問題呢
- 首次請求頁麵時,我們隻加載靜態資源,和外圍的模版,然後通過一個ajax請求拿到我們的動態數據,參考代碼
- 通過在頁麵中放一個隱藏的iframe,然後在iframe所引用的頁麵中使用app cache緩存,參考代碼
- 使用localStroage進行存儲,然後利用cookie進行更新,具體參考google和bing的做法
最後更新:2017-04-02 16:47:46