1.記得幫頁(yè)面成肥
我們?yōu)g覽網(wǎng)頁(yè)實(shí)際上是將虛擬主機中的網(wǎng)頁(yè)內容下載到本地硬盤(pán),再用瀏覽器解釋查看。下載載網(wǎng)頁(yè)的快慢在顯示速度上占了很大比重,所以,網(wǎng)頁(yè)本身所占的空間越小,那么瀏覽速度就會(huì )越快。這就要求在做網(wǎng)頁(yè)的時(shí)候遵循一切從簡(jiǎn)的原則,如:不要使用太大的 Flash動(dòng)畫(huà)、圖片等資源。干凈、簡(jiǎn)潔的頁(yè)面會(huì )給人一種思路明朗的感覺(jué)。
2.如沒(méi)必要,盡量使用靜態(tài)HTML頁(yè)面
眾所周知,ASP、PHP、JSP等程序實(shí)現了網(wǎng)頁(yè)信息的動(dòng)態(tài)交互,運行起來(lái)的確非常方便,因為它們的數據交互性好,能很方便地存取、更改數據庫的內容,使網(wǎng)站“動(dòng)”起來(lái),如:論壇、留言板等。但是這類(lèi)程序必須先由服務(wù)器執行處理后,生成HTML頁(yè)面,然后再“送”往客戶(hù)端瀏覽,這就不得不耗費定的服務(wù)器資源。如果在虛擬主機上過(guò)多地使用這類(lèi)程序,網(wǎng)頁(yè)顯示速度肯定會(huì )慢,所以沒(méi)有必要,請盡量使用靜態(tài)的HTML頁(yè)面。

3.不要將整個(gè)頁(yè)面內容塞到一個(gè)Table中
很多站長(cháng)為了追求頁(yè)面統一對齊,將整個(gè)頁(yè)面的內容都塞進(jìn)了一個(gè)Table(表格)里,然后再由單元格d來(lái)劃分各個(gè)“塊”的布局,這種網(wǎng)站的顯示速度是絕對慢的。因為 Table要等里面所有的內容都加載完畢后才顯示出來(lái)的,如果某些內容無(wú)法訪(fǎng)問(wèn),就會(huì )拖延整個(gè)頁(yè)面的訪(fǎng)問(wèn)速度。正確的做法是是:將內容分割到幾個(gè)具有相同格局的Table中去,不要全都塞到一個(gè)Table里。
4.將ASP、ASPX、PHP等文件的訪(fǎng)問(wèn)改為.js引用
在A(yíng)SP、ASPX、PP等程序設計時(shí)應該注意,如果要在靜態(tài)的HTML頁(yè)面里嵌入動(dòng)態(tài)的數據,而這些動(dòng)態(tài)的數據是由ASP、PHP等程序來(lái)提供的話(huà),會(huì )使用以下的語(yǔ)句引用,這樣的話(huà),每次有一個(gè)人訪(fǎng)問(wèn)你的網(wǎng)站,服務(wù)器就要執行并處理一次 tong)I.asp文件,從數據庫抽取相應的數據,再輸出給網(wǎng)頁(yè)顯示,如果有幾萬(wàn)個(gè)人同時(shí)訪(fǎng)問(wèn),就要執行幾萬(wàn)次次,后果就可想而知。建議在這些程序中將數據動(dòng)態(tài)生成到一個(gè)1.js文件中去,然后在首頁(yè)通過(guò)過(guò)KSCRIPTsre="http://www.XXX.com/1.js"></SCRIPT>這樣的代碼來(lái)引用該1.js文件。這樣,數據顯示的任務(wù)就交給客戶(hù)端的瀏覽器去做,不會(huì )耗費服務(wù)器的資源,顯示速度自然就很快。
5.使用iframe嵌套另一頁(yè)面
如果你要在網(wǎng)站上插入一些廣告代碼,又不想讓這些廣告網(wǎng)站影響速度的話(huà),那么,使用iframe最合適不過(guò)了。方法是:將這些廣告代碼放到一個(gè)獨立的頁(yè)面去,然后在首頁(yè)用如下的代碼將該頁(yè)面嵌入即可,這樣就不會(huì )因為廣告頁(yè)面的延遲而拖了整個(gè)首頁(yè)的顯示,代碼如下:
<IFRAMEmarginwidth=0marginheight=0sre="htp://www.+com" frameborder=0 width =468 scrolling =no height=60 leftmargin="0"topman
gin="0"></IFRAME
其中http:/www.本事率,com是被引用文件的路徑。
6.講究網(wǎng)站計數器代碼放置的技巧
在網(wǎng)頁(yè)里放置計數器可以統計網(wǎng)站的訪(fǎng)問(wèn)流量,為站長(cháng)和廣告商家提供訪(fǎng)問(wèn)依據。但是,不管功能有多強大的網(wǎng)站統計系統,都會(huì )有出故障的時(shí)候。如果直接把統計代碼放到頁(yè)面內容的前面,或者放在一個(gè)Table或者div標簽里,那么在計數器不能訪(fǎng)問(wèn)的時(shí)候,你的頁(yè)面上那個(gè)Table或者diyv就會(huì )產(chǎn)生幾十秒鐘的延遲,導致頁(yè)面很長(cháng)時(shí)間才能訪(fǎng)問(wèn)。所以,要提高網(wǎng)站的速度,就要講究統計代碼放置的位置,正確的方法是:把統計代碼放到頁(yè)面的最下面,并且不要和頁(yè)面內容同在一個(gè) able或者div標簽里??梢栽陧?yè)面代碼的最下方直接放置統計代碼,或者在最下方單獨做一個(gè)Table或者div來(lái)放置計數器。這樣,在計數器不能訪(fǎng)問(wèn)的時(shí)候,你的網(wǎng)站速度也不會(huì )受到絲毫影響。
7.友情鏈接的學(xué)問(wèn)
網(wǎng)站之間互相做鏈接可以增加網(wǎng)站的宣傳效果,做LOGO圖片鏈接更能準確地描述網(wǎng)站的主題和定位,宣傳效果會(huì )大大地增強,但圖片鏈接做得太多,必然會(huì )影響網(wǎng)頁(yè)的顯示速度。很多站長(cháng)都喜歡直接引用友情網(wǎng)站上的圖片URL,這樣圖片要先經(jīng)過(guò)加載才能顯示,各個(gè)友情網(wǎng)站的訪(fǎng)問(wèn)速度不一樣,整個(gè)表格都要等圖片都下載完了才能顯示出來(lái),這樣大大降低了網(wǎng)頁(yè)的速度。因此,做友情鏈接時(shí)應盡量做到:
(1)只做文字鏈接:做文字鏈接是不會(huì )延遲網(wǎng)頁(yè)速度的。
(2)將所有鏈接放到一個(gè)獨立的分頁(yè)去,然后在首頁(yè)鏈接上該頁(yè)
(3)如果友情鏈接一定要出現在首頁(yè),請將鏈接所在的整個(gè)Table放到頁(yè)面的最下方,因為頁(yè)面是由上到下逐行顯示的,將其放到頁(yè)面的最下方,不會(huì )延遲其他內容的顯示
(4)友情鏈接的LOCO圖片先下載后再傳到自己的網(wǎng)頁(yè)空間,這樣,速度由自己的網(wǎng)站空間決定而不受友情網(wǎng)站的影響。
下面介紹在提高網(wǎng)站訪(fǎng)問(wèn)速度過(guò)程中,用于解決具體問(wèn)題的方法:
(1)減少HTP請求數量。
80%的用戶(hù)響應時(shí)間被花費在下載頁(yè)面中的圖片、樣式表、腳本以及 Flash這些組件。減少這些組件的數量就可以減少展示頁(yè)面所需的請求數,而這是提高網(wǎng)頁(yè)響應速度的關(guān)鍵。
(2)使用內容分布式網(wǎng)絡(luò )。
用戶(hù)連接網(wǎng)站服務(wù)器的速度影響響應的快慢。把你的網(wǎng)站布置在多臺分布于不同地域的服務(wù)器上,會(huì )讓用戶(hù)覺(jué)得你的頁(yè)面加載速度更快。
(3)給頭部添加一個(gè)失效期或者Cache-Control
給頭部添加 far future失效期,可以增加瀏覽器緩存的組件數量并重復用于 千隨后的頁(yè)面瀏覽而不需要通過(guò)用戶(hù)的網(wǎng)絡(luò )發(fā)送哪怕一個(gè)字節。
(4)Cip壓縮組件。
壓縮文件會(huì )減少HTTP響應的大小從而減少響應的時(shí)間。
(5)把樣式表放在前面。
把樣式表挪到文檔的頭部可以讓頁(yè)面的加載顯得更快。因為把樣式表放在頭部可以讓頁(yè)面逐步呈現。
(6)把腳本放在最后。
腳本可能會(huì )堵塞并發(fā)的下載。通常的建議是使用延遲腳本。如果一個(gè)腳本可以被延遲,那么它也可以被放在頁(yè)面的底部。這會(huì )讓你的頁(yè)面加載得更快。
(7)不使用CSs表達式。
CSS表達式的問(wèn)題是它比大多數人期望的執行次數更頻繁。
(8)使用外部的Javascript和CSs
在實(shí)際應用中使用外部的文件往往產(chǎn)生更快的頁(yè)面,因為瀏覽器會(huì )緩存Javascript和CSS文件。
(9)減少DNS的查詢(xún)。
減少不同域名的數量可能減少頁(yè)面并行的下載數量。
(10)縮小Javascript和CSS
縮小是指從代碼中刪除不必要的字母,減少文件體積從而提高加載速度。
(11)避免重定向。
重定向降低了用戶(hù)體驗。在用戶(hù)和HTML文檔之間插入的重定向延誤了頁(yè)面的呈現和組件下載,因為它們都不可能在獲得HTML文檔之前開(kāi)始。(12)移除重復的腳本。
在同一個(gè)頁(yè)面中包含兩個(gè)相同的腳本文件降低了性能。當腳本被重復包含時(shí),由于增加了不必要的HTP請求和 Javascript的執行,影影響了性能。
(13)設定Etags
ETag的問(wèn)題是它們往往在網(wǎng)站的一個(gè)服務(wù)器中被設為唯一的,當瀏覽器從個(gè)服務(wù)器得到了組件并在稍后試圖到另一個(gè)服務(wù)器驗證時(shí),ETag會(huì )不匹配,而這在使用多個(gè)服務(wù)器來(lái)處理請求的網(wǎng)站中是很常見(jiàn)的。
(14)讓jax可以緩存。
jax的好處之一是它能給用戶(hù)提供瞬間的響應,因為它從服務(wù)端異步請求數據。為了提高性能,優(yōu)化Ajax響應很重要。提高jax性能最重要的方式是使響應緩存。
(15)更早地刷新緩沖區。
當用戶(hù)請求一個(gè)頁(yè)面,服務(wù)端會(huì )花費200至500毫秒的時(shí)間組合HTML頁(yè)面。
(16)在jax請求中使用GET方法。
(17)后加載組件。
當你確保頁(yè)面工作正常時(shí),通過(guò)延后加載的那些更花哨的腳本比如拖放和動(dòng)畫(huà),可以來(lái)增強你的頁(yè)面。
(18)預先加載組件。
預先加載組件讓你可以利用瀏覽器的空閑時(shí)間來(lái)加載之后需要的組件(比如圖片,樣式表和腳本)。這樣當用戶(hù)瀏覽下一個(gè)頁(yè)面的時(shí)候,大部分組件都已經(jīng)在緩存里了而頁(yè)面會(huì )加載得更快。
(19)減小DOM元素的數量。
復雜的頁(yè)面意味著(zhù)更多的字節需要被下載。你在頁(yè)面中添加一個(gè)事件,讓它在500或者5000個(gè)DOM元素中循環(huán),它們的效率是不同的。
(20)分域部署部件。
將部件分割能使你獲得最大的并行下載效率。但你同時(shí)需要注意不使用多于2~4個(gè)域名,以避免DNS査詢(xún)導致的問(wèn)題。
(21)減少I(mǎi)frame的數量。
Iframes能夠使HTML文檔被插入進(jìn)父級文檔中。
(22)避免404錯誤。
一個(gè)獲得沒(méi)用的404響應的HTTP請求對于寶貴的HYYTP請求資源來(lái)說(shuō)是完全不必要的,而且這樣還會(huì )減慢用戶(hù)的體驗。
(23)減少Cookie的大小。
有多種理由讓我們應用 HYTP Cookie,比如身份驗證,或者個(gè)性化設置Cookie中的信息在服務(wù)端和瀏覽器間被放在HTP頭中交換。盡量減少Cookie的體積對減少用戶(hù)獲得響應的時(shí)間十分重要。
(24)為部件使用沒(méi)有Cookie的域名。
當瀏覽器請求一個(gè)靜態(tài)圖片并一同發(fā)送Cookie時(shí),服務(wù)器并不需要這些Cookie。這樣只是毫無(wú)益處地創(chuàng )建了多余的網(wǎng)絡(luò )流量。應當保證靜態(tài)的部件在請求時(shí)沒(méi)有攜帶Cookie,所以需要把你的靜態(tài)部件放在另一個(gè)子域名下。
(25)減少DOM的讀取。
利用Javascript讀取DOM元元素很慢,所以為了獲得響應更快的頁(yè)面,你應該:緩存被讀取的元素引用。
脫機更新節點(diǎn),然后把它們加加回到樹(shù)結構中。避免利用Javascript定位布局。
(26)開(kāi)發(fā)靈巧的事件處理程序。
如果有太多的事件處理邏輯部署在DOM樹(shù)的不同元素上,它們的頻繁執行會(huì )拖慢頁(yè)面的響應速度。
(27)選擇<link>而不是@。
前面提到把CSS應當放在最頂端來(lái)提供預顯。在E中,放在在頁(yè)面底部的@Import和<link>效果是一樣的,所以最好不要用它。
(28)不使用過(guò)濾器。
E專(zhuān)有的Alphalmage Loader過(guò)濾器是為了解決半透明真色PNG圖片在IE7之前的版本中顯示的問(wèn)題。這個(gè)過(guò)濾器會(huì )在圖片下載時(shí)堵塞住展示。而且它會(huì )消耗內存并影響每個(gè)元素而不僅僅是每張圖片,所以這個(gè)過(guò)濾器的問(wèn)題很多。
(29)優(yōu)化圖片。
(30)優(yōu)化CSS精靈。
橫向布局 Sprite中的圖片往往比縱向布局會(huì )減少文件大小。
(31)不要在HTML中縮放圖片。
不要使用大小超過(guò)需要的圖片,即使你能夠在HTML中設置它的屬性。
(32)使用小的可緩存的 Favicon.ico。
Favicon.icon是放在服務(wù)器根目錄的一個(gè)圖片,它麻煩卻不得不處理,因為即使你不關(guān)心,瀏覽器依然會(huì )請求這張圖片,所以最好不要提供一個(gè)404的錯誤。而且由于它是在同一服務(wù)器下的,Cookie也會(huì )隨著(zhù)每次請求一并發(fā)送。這張圖片同樣干擾下載隊列,比如在E中,當你在onload事件中請求額外的會(huì )在這些額外組件之前下載。
(33)保證組件大小小于25K。
(34)把網(wǎng)站制作的組件打包進(jìn)多部分文檔中。
本文地址:http://www.havencoinwallet.com//article/3403.html