2019-7-24 seo達(dá)人
如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里
減少頁(yè)面加載時(shí)間的方法：
1.壓縮html css js等文件
2.減少DNS解析
3.減少DOM元素，對(duì)于相關(guān)操作可以緩存節(jié)點(diǎn)
4.改變頁(yè)面元素樣式時(shí)盡量操作className，而不是頻繁使用xxx.style.（其實(shí)還有很多這種DOM修改操作的細(xì)節(jié)比如opacity替代visibility ，多個(gè)DOM統(tǒng)一操作（雖然V8會(huì)有緩存優(yōu)化） ，先將DOM離線，即display：none；修改后顯示 ，不要把DOM放在已給循環(huán)中作為循環(huán)變量 ，不要使用table ）
5.避免不必要的重定向
6.合并js css及圖片，減少請(qǐng)求數(shù)量
7.使用CDN
8.合理利用緩存
9…
關(guān)于CDN？
https://zhuanlan.zhihu.com/p/39028766
CDN中文名“內(nèi)容分發(fā)網(wǎng)路”，作用是減少傳播時(shí)延，找最近的節(jié)點(diǎn)。CDN本質(zhì)就一個(gè)是緩存，只是這個(gè)緩存離你特別近，不管是作為用戶還是開發(fā)人員都能從中享受一點(diǎn)福利。
CDN的優(yōu)點(diǎn)
1.訪問加速
2.減輕服務(wù)器負(fù)載
3.抗住攻擊
CDN的缺點(diǎn)
1.只能對(duì)靜態(tài)資源加速
2.內(nèi)容更新時(shí)需要分發(fā)到其他節(jié)點(diǎn)
3.代價(jià)高昂
與傳統(tǒng)網(wǎng)站訪問方式的不同
傳統(tǒng)的網(wǎng)站會(huì)直接解析域名獲得IP地址然后發(fā)送請(qǐng)求
使用了CDN的網(wǎng)站則增加了緩存層，解析域名→獲取對(duì)應(yīng)CNAME域名→對(duì)獲取的域名進(jìn)行解析得到緩存服務(wù)器的IP地址，將用戶的訪問請(qǐng)求引導(dǎo)到最優(yōu)的緩存節(jié)點(diǎn)而不是源站。
總結(jié)：通過權(quán)威DNS服務(wù)器來實(shí)現(xiàn)最優(yōu)節(jié)點(diǎn)的選擇，通過緩存來減少源站的壓力。主要應(yīng)用于靜態(tài)網(wǎng)頁(yè)、大文件的下載等等。
應(yīng)用與踩坑
緩存設(shè)置
max-age在Cache-Control中經(jīng)常用于緩存的控制，可是max-age設(shè)置的緩存會(huì)應(yīng)用于一個(gè)請(qǐng)求經(jīng)過的每一級(jí)，如果我們希望CDN不緩存那么久，要怎么辦呢？那就是s-maxage，它用于設(shè)置代理服務(wù)器的緩存時(shí)間，會(huì)覆蓋max-age的設(shè)置，這樣我們可以把max-age用于本地緩存，把s-maxage用于CDN緩存時(shí)間，避免臟數(shù)據(jù)的產(chǎn)生。
緩存命中率
對(duì)于一個(gè)緩存而言，還有一點(diǎn)非常重要，就是你的緩存到底有沒有用，衡量這個(gè)東西的就是緩存命中率。如果只是靜態(tài)資源，在刷新緩存之后，可能導(dǎo)致命中率下降，因此CDN的資源不適合經(jīng)常刷新，換句話說，如果一個(gè)請(qǐng)求結(jié)果會(huì)經(jīng)常進(jìn)行變更，那么CDN基本就沒有什么存在的意義了。
判斷是否命中緩存
還要考慮的一件事是：這個(gè)資源是否命中了CDN，是否是因?yàn)镃DN導(dǎo)致的問題。
在各大廠商的CDN返回的數(shù)據(jù)中都會(huì)有一個(gè)X-Cache，上面內(nèi)容是Hit或者M(jìn)iss，還會(huì)加上諸如Memory或者Disk的縮寫表示內(nèi)存還是磁盤，如果出現(xiàn)Upstream或者M(jìn)iss則表示沒有命中。
資源預(yù)熱
緩存設(shè)計(jì)中，預(yù)熱是很重要的環(huán)節(jié)，在最初剛開始啟動(dòng)CDN的時(shí)候，CDN上并沒有緩存數(shù)據(jù)，此刻大量的請(qǐng)求全部打向源站，肯定會(huì)把源站打掛，預(yù)熱就是實(shí)現(xiàn)緩存熱門數(shù)據(jù)，這樣在業(yè)務(wù)上線時(shí)，CDN上已經(jīng)有所需的數(shù)據(jù)了
藍(lán)藍(lán)設(shè)計(jì)( sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://sillybuy.com