TGideas實(shí)例：加載，不只是少一點(diǎn)點(diǎn)

對(duì)于加載精簡(jiǎn)來(lái)說(shuō)，最大的好處莫過(guò)于對(duì)頁(yè)面的加速。加速有兩點(diǎn)：第一是由于資源加載量減少，對(duì)于頁(yè)面首屏加載速度的提升；第二是某些加載精簡(jiǎn)的方法，會(huì)在一定程度上加快頁(yè)面的渲染速度。同時(shí)，由于加載量的減少，剩下了一些帶寬，從而減少了帶寬費(fèi)用。

當(dāng)然，事情都有兩面的地方。加載精簡(jiǎn)會(huì)在一定程度上影響頁(yè)面的SEO；部分方法也會(huì)造成一些額外的腳本開(kāi)銷。

尋找合適你的方法很重要，畢竟每個(gè)網(wǎng)站性質(zhì)、用處、節(jié)點(diǎn)都可能不同。比如項(xiàng)目初期，可能宣傳和擴(kuò)散知名度方面重要些，這時(shí)候建議不要大量使用動(dòng)態(tài)生成內(nèi)容的方式，影響SEO。

第1章 存儲(chǔ)資源

1.1 離線存儲(chǔ)

1.1.1 為了移動(dòng)

由于瀏覽器支持情況不同，離線存儲(chǔ)在PC端沒(méi)有大量的使用，反而在移動(dòng)端的支持情況越來(lái)越好，如今Android、iOS都能使用離線存儲(chǔ)，所以離線存儲(chǔ)廣泛的使用于離線APP應(yīng)用。

對(duì)于離線存儲(chǔ)，最重要的便是manifest文件。我們將需要緩存的文件列入cache段，將不需要緩存的內(nèi)容列入network段即可。

圖2-1 manifest文件示例

當(dāng)瀏覽器加載頁(yè)面時(shí)，發(fā)現(xiàn)manifest文件后，會(huì)檢查它的內(nèi)容是不是有修改，如果是，重新下載cache段的文件并緩存；如果不是，則跳過(guò)。

圖2-2 更新離線緩存

需要注意的是，當(dāng)我們使用離線存儲(chǔ)時(shí)，瀏覽器會(huì)強(qiáng)行只讀離線緩存的文件。我們需要將頁(yè)面使用到的所有的資源都列入manifest文件中，不論是在cache段，還是network段。否則瀏覽器將報(bào)錯(cuò)，說(shuō)找不到文件。

圖2-3 未將所有文件列入的加載報(bào)錯(cuò)情況

1.1.2 更新

對(duì)離線存儲(chǔ)的資源更新，需要修改manifest文件的內(nèi)容。當(dāng)然，我們一般不會(huì)隨意修改文件名已達(dá)到修改manifest文件內(nèi)容的目的。一般的做法是，在文件內(nèi)新增一行注釋，注釋中寫明目前的版本號(hào)，以后每次需要更新的時(shí)候，修改版本號(hào)就行了。

圖2-4 第二行即為注釋的版本信息

另外，我們可能需要功能更加強(qiáng)大的離線存儲(chǔ)緩存更新的機(jī)制。試想一個(gè)新聞?lì)惖腁PP，我們需要在手機(jī)離線時(shí)讀取本地存儲(chǔ)的數(shù)據(jù)，當(dāng)APP發(fā)現(xiàn)用戶聯(lián)網(wǎng)后，將讀取在線的內(nèi)容，更新本地的數(shù)據(jù)和頁(yè)面信息。

對(duì)于圖2-