如何提高網(wǎng)站的負(fù)載性能?網(wǎng)站建設(shè)公司根據(jù)自己的親身經(jīng)歷總結(jié)了以下幾個(gè)方面,希望能給新手站長(zhǎng)一些幫助。
1.減少HTTP請(qǐng)求的數(shù)量
構(gòu)造請(qǐng)求和等待響應(yīng)需要時(shí)間,所以請(qǐng)求越少越好。請(qǐng)求縮減的總體思路是組合資源,減少顯示一個(gè)頁(yè)面所需的文件數(shù)量。
1).圖像映射
通過(guò)設(shè)置標(biāo)簽的usemap屬性并使用標(biāo)簽,可以剪切圖片中的多個(gè)區(qū)域并指向不同的鏈接。與使用多個(gè)圖像分別建立鏈接相比,減少了請(qǐng)求的數(shù)量。
2).CSS Sprite(CSS貼圖集成/貼圖展平/貼圖定位)
這是通過(guò)設(shè)置元素的背景位置樣式實(shí)現(xiàn)的。對(duì)于一般界面圖標(biāo)。通常,您可以參考TinyMCE編輯器頂部的那些小按鈕。本質(zhì)上是多個(gè)縮略圖被一個(gè)統(tǒng)一的縮略圖切割成不同的偏移量,這樣加載界面上的很多按鈕實(shí)際上只需要請(qǐng)求一次(請(qǐng)求縮略圖一次),從而減少了HTTP請(qǐng)求的次數(shù)。
3).嵌入圖像(嵌入圖像)
您沒(méi)有在src中指定外部圖像文件的URL,而是將圖像信息直接放入。比如src=' data:image/gif;Base64,R0lGODlhDAAMAL .在一些特殊情況下是有用的(比如一個(gè)小圖片只在當(dāng)前頁(yè)面使用)。
2.使用多線CDN
為您的站點(diǎn)提供多條線路(如國(guó)內(nèi)電信、聯(lián)通、移動(dòng))和多個(gè)地理位置(北、南、西)的接入,讓所有用戶都能快速訪問(wèn)。
3.使用HTTP緩存
向不經(jīng)常更新的資源(如靜態(tài)圖)添加較長(zhǎng)的過(guò)期標(biāo)題信息。這些資源一旦緩存,在未來(lái)很長(zhǎng)一段時(shí)間內(nèi)都不會(huì)重復(fù)傳輸。
4.使用Gzip壓縮
使用Gzip壓縮HTTP消息可以減少大小和傳輸時(shí)間。
5.將樣式表放在頁(yè)面的前面
先加載樣式表,這樣頁(yè)面渲染可以更早開(kāi)始,給用戶一種頁(yè)面加載更快的感覺(jué)。
6.將腳本放在頁(yè)面的末尾
同樣,頁(yè)面顯示要先處理,頁(yè)面渲染要早完成,腳本邏輯要晚執(zhí)行,給用戶頁(yè)面加載更快的感覺(jué)。
7.避免CSS表達(dá)式
過(guò)于復(fù)雜的JavaScript腳本邏輯、DOM搜索和選擇操作會(huì)降低頁(yè)面處理的效率。
8.使用JavaScript和CSS作為拓展資源
這似乎違背了原則1中的合并思想,其實(shí)不然:考慮到每個(gè)頁(yè)面都引入了一個(gè)通用的JavaScript資源(比如jQuery或ExtJS之類的JavaScript庫(kù))。單就頁(yè)面性能而言,內(nèi)聯(lián)(即將JavaScript嵌入HTML)頁(yè)面比外部(用標(biāo)簽導(dǎo)入)頁(yè)面加載更快(因?yàn)樗腍TTP請(qǐng)求更少)。但是如果很多頁(yè)面都引入了這種常見(jiàn)的JavaScript資源,內(nèi)聯(lián)方案就會(huì)造成重復(fù)傳輸(由于這種資源是嵌入在每個(gè)頁(yè)面中的,所以每打開(kāi)一個(gè)頁(yè)面就要傳輸一次,造成網(wǎng)絡(luò)傳輸資源的浪費(fèi))。這個(gè)問(wèn)題可以通過(guò)獨(dú)立利用這些資源來(lái)解決。
因?yàn)镴avaScript和CSS相對(duì)穩(wěn)定,所以我們可以為它們對(duì)應(yīng)的資源設(shè)置更長(zhǎng)的有效期(參考原則3)。
9.減少DNS查找
作者的建議是:
1).使用Keep-Alive保持聯(lián)系。
如果連接斷開(kāi),下一次將執(zhí)行DNS查找,即使相應(yīng)的域名-IP映射已被緩存,查找也需要一些時(shí)間。
2).減少域名
每次請(qǐng)求新域名,都需要通過(guò)DNS搜索不同的域名,DNS緩存無(wú)法工作。所以盡量在一個(gè)統(tǒng)一的域名下組織站點(diǎn),避免使用過(guò)多的子域。
10.壓縮你的JavaScript
使用JS壓縮工具來(lái)壓縮您的JavaScript。非常有效。看看jQuery的兩個(gè)不同發(fā)行版,看看它們的區(qū)別:
jQuery代碼的Http://code.jquery.com/jquery-1.6.2.js版本,230KB。
Http://code.jquery.com/jquery-1.6.2.min.js壓縮jQuery代碼(用于實(shí)際部署),89.4KB
11.盡量避免重定向
重定向是指在你實(shí)際訪問(wèn)你想看的頁(yè)面之前,增加一輪額外的HTTP請(qǐng)求(客戶端發(fā)起HTTP請(qǐng)求HTTP服務(wù)器返回重定向響應(yīng)客戶端發(fā)起請(qǐng)求新的URLHTTP服務(wù)器返回內(nèi)容,下劃線部分是額外的請(qǐng)求),所以需要更多的時(shí)間(給人的感覺(jué)是響應(yīng)很慢)。所以除非必要,否則不要使用重定向。幾種“必要”情況:
1).避免無(wú)效的URL。
舊站點(diǎn)遷移后,為了避免舊URL失效,通常會(huì)將對(duì)舊URL的請(qǐng)求重定向到新系統(tǒng)的相應(yīng)地址。
2) URL美化
在可讀URL和實(shí)際資源URL之間轉(zhuǎn)換。比如Google Toolbar,用戶記住了http://www.google.com這個(gè)對(duì)人類有意義的地址,卻很難記住http://www . Google . com/tools/Firefox/Toolbar/FT3/intl/en/index . html這個(gè)真實(shí)的資源地址。所以保留前者,把對(duì)前者的請(qǐng)求重定向到后者。
12.刪除重復(fù)的腳本
不要在一個(gè)頁(yè)面中重復(fù)介紹同一個(gè)腳本。例如,如果腳本B和C都依賴于A,那么在使用B和C的頁(yè)面中可能會(huì)出現(xiàn)對(duì)A的重復(fù)引用,解決方案:對(duì)于簡(jiǎn)單的站點(diǎn),手動(dòng)檢查依賴關(guān)系,消除重復(fù)介紹;對(duì)于復(fù)雜的站點(diǎn),需要建立自己的依賴管理/版本控制機(jī)制。
13.小心處理電子標(biāo)簽
ETag是除Last-Modified之外的另一種HTTP緩存方法。確定資源是否已經(jīng)過(guò)哈希處理。但是ETag也有一些問(wèn)題,比如:
1).不一致:不同的Web服務(wù)器(Apache、IIS等。)定義不同的ETag格式。
2).etag的計(jì)算是不穩(wěn)定的(由于太多因素),例如:
1)同一資源在不同服務(wù)器上計(jì)算的etag不同。大型Web應(yīng)用通常由多臺(tái)服務(wù)器提供服務(wù),這樣客戶端在服務(wù)器A緩存的資源顯然仍然有效,但在下一次請(qǐng)求B時(shí)會(huì)因?yàn)閑tag的不同而被視為無(wú)效,導(dǎo)致同一資源的重復(fù)傳輸。
2)資源保持不變,但是ETag由于一些其他因素而改變,例如配置文件改變。直接結(jié)果就是系統(tǒng)更新后,客戶端緩存大規(guī)模失效,導(dǎo)致傳輸量大增,站點(diǎn)性能下降。
筆者的建議是:要么根據(jù)你的應(yīng)用特點(diǎn)改進(jìn)現(xiàn)有的ETag的計(jì)算方法,要么干脆用最簡(jiǎn)單的Last-Modified代替ETag。
14.在Ajax中使用HTTP緩存
Ajax是一種異步請(qǐng)求。不會(huì)阻礙你現(xiàn)在的操作。當(dāng)請(qǐng)求完成時(shí),您可以立即看到結(jié)果。但是,異步并不意味著可以立即完成,也不意味著需要無(wú)限的時(shí)間才能完成。所以要注意Ajax請(qǐng)求的性能。很多Ajax請(qǐng)求訪問(wèn)的都是相對(duì)穩(wěn)定的資源,所以不要忘了利用好Ajax請(qǐng)求的HTTP緩存機(jī)制。詳見(jiàn)原則3和原則13。
我們專注高端建站,小程序開(kāi)發(fā)、軟件系統(tǒng)定制開(kāi)發(fā)、BUG修復(fù)、物聯(lián)網(wǎng)開(kāi)發(fā)、各類API接口對(duì)接開(kāi)發(fā)等。十余年開(kāi)發(fā)經(jīng)驗(yàn),每一個(gè)項(xiàng)目承諾做到滿意為止,多一次對(duì)比,一定讓您多一份收獲!