緩存類
合理利用瀏覽器緩存
除了上面說(shuō)到的使用Cache-Control处嫌、Expires愧杯、Etag和Last-Modified來(lái)設(shè)置HTTP緩存外场钉，在移動(dòng)端還可以使用localStorage等來(lái)保存AJAX返回的數(shù)據(jù)盟萨，或者使用localStorage保存CSS或JavaScript靜態(tài)資源內(nèi)容圈纺，實(shí)現(xiàn)移動(dòng)端的離線應(yīng)用，盡可能減少網(wǎng)絡(luò)請(qǐng)求默赂，保證靜態(tài)資源內(nèi)容的快速加載沛鸵。
靜態(tài)資源離線方案
對(duì)于移動(dòng)端或Hybrid應(yīng)用，可以設(shè)置離線文件或離線包機(jī)制讓靜態(tài)資源請(qǐng)求從本地讀取缆八，加快資源載入速度曲掰，并實(shí)現(xiàn)離線更新。關(guān)于這塊內(nèi)容奈辰，我們會(huì)在后面的章節(jié)中重點(diǎn)講解栏妖。
嘗試使用AMP HTML
AMP HTML可以作為優(yōu)化前端頁(yè)面性能的一個(gè)解決方案，使用AMP Component中的元素來(lái)代替原始的頁(yè)面元素進(jìn)行直接渲染奖恰。
!-- 不推薦 --
<video width="400" height="300" src="http://www.domain.com/videos/myvideo.mp4" poster="path/poster.jpg">
<div fallback>
<p>Your browser doesn’t support HTML5 video</p>
</div>
<source type="video/mp4" src="foo.mp4">
<source type="video/webm" src="foo.webm">
</video>
!-- 推薦 --
<amp-video width="400" height="300" src="http://www.domain.com/videos/myvideo.mp4" poster= "path/poster.jpg">
<div fallback>
<p>Your browser doesn’t support HTML5 video</p>
</div>
<source type="video/mp4" src="foo.mp4">
<source type="video/webm" src="foo.webm">
</amp-video>
