網(wǎng)站設(shè)計制作中如何提高網(wǎng)站的訪問速度?專業(yè)知識介紹

2022-05-21    分類: 網(wǎng)站設(shè)計

(1)減少HTTP請求數(shù)量。
80%的用戶響應(yīng)時間被花費(fèi)在下載頁面中的圖片、樣式表、腳本以及Flash這些組件。減少這些組件的數(shù)量就可以減少展示頁面所需的請求數(shù),而這是提高網(wǎng)頁響應(yīng)速度的關(guān)鍵。
(2)使用內(nèi)容分布式網(wǎng)絡(luò)。
用戶連接網(wǎng)站服務(wù)器的速度影響響應(yīng)的快慢。把你的網(wǎng)站布置在多臺分布于不同地域的服務(wù)器上,會讓用戶覺得你的頁面加載速度更快。
(3)給頭部添加一個失效期或者Cache-Control。
給頭部添加far future失效期,可以增加瀏覽器緩存的組件數(shù)量并重復(fù)用于隨后的頁面瀏覽而不需要通過用戶的網(wǎng)絡(luò)發(fā)送哪怕一個字節(jié)。
(4)Gzip壓縮組件。
壓縮文件會減少HTTP響應(yīng)的大小從而減少響應(yīng)的時間。
(5)把樣式表放在前面。
把樣式表挪到文檔的頭部可以讓頁面的加載顯得更快。因為把樣式表放在頭部可以讓頁面逐步呈現(xiàn)。
(6)把腳本放在最后。
腳本可能會堵塞并發(fā)的下載。通常的建議是使用延遲腳本。如果一個腳本可以被延遲,那么它也可以被放在頁面的底部。這會讓你的頁面加載得更快。
(7)不使用CSS表達(dá)式。
CSS表達(dá)式的問題是它比大多數(shù)人期望的執(zhí)行次數(shù)更頻繁。
(8)使用外部的JavaScript和CSS.
在實際應(yīng)用中使用外部的文件往往產(chǎn)生更快的頁面,因為瀏覽器會緩存JavaScript和CSS文件。
(9)減少DNS的查詢。
減少不同域名的數(shù)量可能減少頁面并行的下載數(shù)量。
(10)縮小JavaScript和CSS。
縮小是指從代碼中刪除不必要的字母,減少文件體積從而提高加載速度。
(11)避免重定向。
重定向降低了用戶體驗。在用戶和HTML文檔之間插入的重定向延誤了頁面的呈現(xiàn)和組件下載,因為它們都不可能在獲得HTML文檔之前開始。
(12)移除重復(fù)的腳本。
在同一個頁面中包含兩個相同的腳本文件降低了性能。當(dāng)腳本被重復(fù)包含時,由于增加了不必要的HTTP請求和JavaScript的執(zhí)行,影響了性能。
(13)設(shè)定ETags。
ETag的問題是它們往往在網(wǎng)站的一個服務(wù)器中被設(shè)為唯一的,當(dāng)瀏覽器從一個服務(wù)器得到了組件并在稍后試圖到另一個服務(wù)器驗證時,ETag會不匹配,而這在使用多個服務(wù)器來處理請求的網(wǎng)站中是很常見的。
(14)讓Ajax可以緩存。
Ajax的好處之一是它能給用戶提供瞬間的響應(yīng),因為它從服務(wù)端異步請求數(shù)據(jù)。為了提高性能,優(yōu)化Ajax響應(yīng)很重要。提高Ajax性能最重要的方式是使響應(yīng)緩存。
(15)更早地刷新緩沖區(qū)。
當(dāng)用戶請求一個頁面,服務(wù)端會花費(fèi)200至500毫秒的時間組合HTML頁面。
(16)在Ajax請求中使用GET方法。
(17)后加載組件。
當(dāng)你確保頁面工作正常時,通過延后加載的那些更花哨的腳本比如拖放和動畫,可以來增強(qiáng)你的頁面。
(18)預(yù)先加載組件。
預(yù)先加載組件讓你可以利用瀏覽器的空閑時間來加載之后需要的組件(比如圖片,樣式表和腳本)。這樣當(dāng)用戶瀏覽下一個頁面的時候,大部分組件都已經(jīng)在緩存里了而頁面會加載得更快。
(19)減小DOM元素的數(shù)量。
復(fù)雜的頁面意味著更多的字節(jié)需要被下載。你在頁面中添加一個事件,讓它在500或者5000個DOM元素中循環(huán),它們的效率是不同的。
(20)分域部署部件。
將部件分割能使你獲得大的并行下載效率。但你同時需要注意不使用多于2~4個域名,以避免DNS查詢導(dǎo)致的問題。
(21)減少lframe的數(shù)量。
lframes能夠使HTML文檔被插入進(jìn)父級文檔中。
(22)避免404錯誤。
一個獲得沒用的404響應(yīng)的HTTP請求對于寶貴的HTTP請求資源來說是完全不必要的,而且這樣還會減慢用戶的體驗。
(23)減少Cookie的大小。
有多種理由讓我們應(yīng)用HTTP Cookie,比如身份驗證,或者個性化設(shè)置。Cookie中的信息在服務(wù)端和瀏覽器間被放在HTTP頭中交換。盡量減少Cookie的體積對減少用戶獲得響應(yīng)的時間十分重要。
(24)為部件使用沒有Cookie的域名。
當(dāng)瀏覽器請求一個靜態(tài)圖片并一同發(fā)送Cookie時,服務(wù)器并不需要這些Cookie。這樣只是毫無益處地創(chuàng)建了多余的網(wǎng)絡(luò)流量。應(yīng)當(dāng)保證靜態(tài)的部件在請求時沒有攜帶Cookie,所以需要把你的靜態(tài)部件放在另一個子域名下。
(25)減少DOM的讀取。
利用Javascript讀取DOM元素很慢,所以為了獲得響應(yīng)更快的頁面,你應(yīng)該:·緩存被讀取的元素引用。
●脫機(jī)更新節(jié)點,然后把它們加回到樹結(jié)構(gòu)中。·避免利用Javascript定位布局。
(26)開發(fā)靈巧的事件處理程序。
如果有太多的事件處理邏輯部署在DOM樹的不同元素上,它們的頻繁執(zhí)行會拖慢頁面的響應(yīng)速度。
(27)選擇而不是@。
前面提到把CSS應(yīng)當(dāng)放在最頂端來提供預(yù)顯。在lIE中,放在頁面底部的@import和效果是一樣的,所以最好不要用它。
(28)不使用過濾器。
IE專有的AlphalmageLoader過濾器是為了解決半透明真色PNG圖片在IE7之前的版本中顯示的問題。這個過濾器會在圖片下載時堵塞住展示。而且它會消耗內(nèi)存并影響每個元素而不僅僅是每張圖片,所以這個過濾器的問題很多。
(29)優(yōu)化圖片。
(30)優(yōu)化CSS精靈。
橫向布局Sprite中的圖片往往比縱向布局會減少文件大小。
(31)不要在HTML中縮放圖片。
不要使用大小超過需要的圖片,即使你能夠在HTML中設(shè)置它的屬性。
(32)使用小的可緩存的Favicon.ico。
Favicon.icon是放在服務(wù)器根目錄的一個圖片,它麻煩卻不得不處理,因為即使你不關(guān)心,瀏覽器依然會請求這張圖片,所以最好不要提供一個404的錯誤。而且由于它是在同一服務(wù)器下的,Cookie也會隨著每次請求一并發(fā)送。這張圖片同樣干擾下載隊列,比如在IE中,當(dāng)你在onload事件中請求額外的組件時,F(xiàn)avicon會在這些額外組件之前下載。
(33)保證組件大小小于25K。
(34)把組件打包進(jìn)多部分文檔中。

名稱欄目:網(wǎng)站設(shè)計制作中如何提高網(wǎng)站的訪問速度?專業(yè)知識介紹
文章鏈接:http://www.bm7419.com/news/155651.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項目有網(wǎng)站設(shè)計

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

網(wǎng)站建設(shè)網(wǎng)站維護(hù)公司

網(wǎng)站設(shè)計知識