從三方面加速CSS樣式作用網(wǎng)頁(yè)速度

2024-07-11 08:43:25

字體：大中小

供稿：網(wǎng)友

最近學(xué)校的網(wǎng)絡(luò)越來越慢了，瀏覽網(wǎng)頁(yè)時(shí)經(jīng)常出現(xiàn)裸奔的現(xiàn)象，于是我就想如何可以盡量避免這一問題，現(xiàn)把自己的一些思路寫出來，以供大家參考：
在我們無法更換服務(wù)器或提高服務(wù)器速度的情況下，要想讓我們的頁(yè)面不"裸"在用戶面前，只能從縮小頁(yè)面、減少HTTP請(qǐng)求和提高客戶端速度等方面來想辦法。
1.縮小頁(yè)面：利用(X)HTML CSS方式搭建網(wǎng)站結(jié)構(gòu)，并使用程序自動(dòng)壓縮CSS和JS文件；
2.減少HTTP請(qǐng)求：(1).由于客戶端每顯示一張圖片都會(huì)向服務(wù)器發(fā)送請(qǐng)求，所以在使用圖片時(shí)能少則少，能合則合，譬如文本編輯器中的小圖標(biāo)或鼠標(biāo)事件出發(fā)的切換圖片都可以用一張圖解決，不過你可能會(huì)有這樣的疑問：圖片的合并不是又導(dǎo)致圖片過大影響下載了嗎？其實(shí)這樣的顧慮在網(wǎng)絡(luò)不是特別慢的情況下是多余的，因?yàn)樵?00K以內(nèi)的圖片，并不會(huì)明顯感覺下載變慢了；(2)這點(diǎn)是我想著重強(qiáng)調(diào)的，即適當(dāng)?shù)貎H將關(guān)于版快的CSS設(shè)為外部鏈接，例如可以把CSS劃分成四類：基本設(shè)置CSS、版快劃分CSS、公用版快CSS、特色版快CSS，而其中的基本設(shè)置和版快劃分所用到的CSS就可以在內(nèi)部直接引用，這樣既可以減少了HTTP請(qǐng)求，又避免了頁(yè)面徹底裸奔；(3).分離邏輯層和結(jié)構(gòu)層，即把后臺(tái)代碼從XHTML中獨(dú)立出來，這點(diǎn)在.net中就得到了很好的實(shí)現(xiàn)，這樣就優(yōu)先載入頁(yè)面結(jié)構(gòu)以及結(jié)構(gòu)圖片,后一步載入當(dāng)前頁(yè)面數(shù)據(jù)；
3.提高客戶端速度:關(guān)于這點(diǎn)的解決方法主要就是針對(duì)JS的編寫了，而我對(duì)JS的理解不是太深，就不多說了，只說兩個(gè)需要注意的小點(diǎn)：盡可能的少用索引訪問，盡量不要使用appendChild方式。

上一篇：我們需要對(duì)CSS進(jìn)行縮寫的原因

下一篇：XHTML CSS制作樣式風(fēng)格切換的WEB站點(diǎn)