1. 程式人生 > >網站訪問速度加速的方法

網站訪問速度加速的方法

一、網上搜集到的一些解決方案

1、減少CSS檔案數量和體積

網站載入CSS檔案的時間為:瀏覽器開始載入html程式碼,發現<head>標籤內有一個<link>標籤引用外部CSS檔案。

注:根據網站CSS載入的特性,如果在編寫過程中有多個CSS檔案,所以建議將多個CSS檔案進行合併,這樣可以加快網站的載入速度。另外,對CSS檔案進行規格化設計,儘量減小CSS的檔案的大小。

2、網站程式中採用DIV+CSS這種模式來設計網站的HTML佈局,儘量減少或者不用Table

DIV+CSS的優點:1)符合W3C標準。微軟等公司均為W3C支持者。這一點是最重要的

,因為這保證您的網站不會因為將來網路應用的升級而被淘汰。(2)支援瀏覽器的向後相容,也就是無論未來的瀏覽器大戰,勝利的是IE7或者是火狐,您的網站都能很好的相容。(3)搜尋引擎更加友好。相對與傳統的table,採用DIV+CSS技術的網頁,對於搜尋引擎的收錄更加友好。(4)樣式的調整更加方便。內容和樣式的分離,使頁面和樣式的調整變得更加方便。 現在YAHOOMSN等國際入口網站,網易,新浪等國內入口網站和主流的WEB2.0網站,均採用DIV+CSS的框架模式,更加印證了DIV+CSS是大勢所趨。(5CSS的極大優勢表現在簡潔的程式碼,對於一個大型網站來說,可以節省大量帶,,而且眾所周知,搜尋引擎喜歡清潔的程式碼。(
6)表現和結構分離,在團隊開發中更容易分工合作而減少相互關聯性。簡單來說:頁面載入速度快、佈局靈活。

Table佈局頁面的缺點:Table佈局的缺點是比其它html標記佔更多的位元組,會阻擋瀏覽器渲染引擎的渲染順序,會影響其內部的某些佈局屬性的生效,但是其優點就是用table做表格是完全正確的。

3、採用Gzip技術對網頁進行壓縮

Gzip技術:GZIP最早由Jean-loup GaillyMark Adler建立,用於UNIX系統的檔案壓縮。我們在Linux中經常會用到字尾為.gz的檔案,它們就是GZIP格式的。現今已經成為Internet 上使用非常普遍的一種資料壓縮格式,或者說一種檔案格式。

HTTP協議上的GZIP編碼是一種用來改進WEB應用程式效能的技術。大流量的WEB站點常常使用GZIP壓縮技術來讓使用者感受更快的速度。這一般是指WWW伺服器中安裝的一個功能,當有人來訪問這個伺服器中的網站時,伺服器中的這個功能就將網頁內容壓縮後傳輸到來訪的電腦瀏覽器中顯示出來。一般對純文字內容可壓縮到原大小的40%。這樣傳輸就快了,效果就是你點選網址後會很快的顯示出來,當然這也會增加伺服器的負載,一般伺服器中都安裝有這個功能模組的。

 採用Gzip技術對網頁進行壓縮是減少網頁體積的一個很好的方式,一般情況下這是需要你的網站空間支援的,像我用的A5的合租主機,壓縮率可以達到80%。網頁體積小了,自然載入速度就快了。

4CDN加速

CDN的全稱是Content Delivery Network,即內容分發網路。其基本思路是儘可能避開網際網路上有可能影響資料傳輸速度和穩定性的瓶頸和環節,使內容傳輸的更快、更穩定。通過在網路各處放置節點伺服器所構成的在現有的網際網路基礎之上的一層智慧虛擬網路,CDN系統能夠實時地根據網路流量和各節點的連線、負載狀況以及到使用者的距離和響應時間等綜合資訊將使用者的請求重新導向離使用者最近的服務節點上。其目的是使使用者可就近取得所需內容,解決 Internet網路擁擠的狀況,提高使用者訪問網站的響應速度。

5、優化程式碼,減少臃腫結構

程式碼優化主要解決的題目就是頁面瀏覽速度和適應性目的。

6、減少圖片大小和數量

網頁中一般應用兩種格局的圖片jpeggif,這兩種圖片的應用良多人掌握的並不是很好,jpeg合用於顏色比較多、構成比較複雜的圖片(好比一些照片、漸變顏色等等),gif合用於顏色比較少、構成比較簡樸的圖片(好比網站的logo、大的色塊構成的圖片等等)Gif圖片尤其要留意匯出的時候選擇顏色數量這樣也會達到很好的減小尺寸的效果。對於一些比較大的圖片我們還可以將它切割成比較小的圖片進行拼接這樣也可以進步網頁的下載速度。減小網頁 size進步網頁下載速度還有一種簡易的方法就是使用一些網頁減肥的小工具,我們可以去下載一些這樣的工具他們可以使你的網頁縮小20%50%達到事半功倍的效果。

7、減少JavaScript指令碼檔案,儘量存放在一個檔案中

8、網站建設中目錄結構優化

現在良多網站都將所有的頁面零散的放在統一個資料夾下而沒有分類,這樣做固然可以但是會對以後的維護等工作帶來很大的麻煩。我們建議應該是建立一個大資料夾,裡邊包括各個頻道的資料夾、網頁頁面圖片資料夾、網頁內容圖片資料夾等等一個一個的單獨種別的資料夾,使得在維護時候可以利便的找到每一個頁面的詳細位置。

9、網站建設中針對搜尋引擎的優化

搜尋引擎優化是良多人都知道的一種優化專案,也是完整的優化工作必不可少的一個步驟。 “樞紐字”在搜尋引擎這個話題裡是一個核心的字眼,幾乎所有的針對搜尋引擎優化題目都是圍繞著“樞紐字”展開的。有良多人盲目的追求在網頁中處處體現樞紐字,覺得這樣就會更輕易被搜尋引擎搜到,實在這樣做並不一定合適。好比前一陣子流行過的“鬼影祕笈”,方法就是用和網頁背景相同的顏色在頁面中躲藏了良多樞紐字,良多人現在還在用這個方法,但是跟著搜尋引擎功能越來越強盛這個方法已經不那麼好用了,甚至會起到反作用。

10、運用靜態的HTML頁面眾所周知,ASPPHPJSP等順序完成了網頁資訊的靜態互動,運轉起來確實十分方便,由於它們的資料互動性好,能很方便地存取、更改資料庫的內容,但是這類順序也有本人的缺陷,那就是它必需由效勞器先生成HTML頁面,然後在“傳送”給使用者,多了一個步驟,必定會影響到網站的拜訪速度,所以筆者建議,在新站開端的時分,在對本人網站的重要調查期內還是採用靜態的HTML頁面比擬保險。

11、將ASPASPXPHP等檔案的訪問改為.js引用

這在ASPASPXPHP等程式設計時應該注意的,如果要在靜態的HTML頁面裡嵌入動態的資料,而這些動態的資料是由ASPPHP等程式來提供的話,會使用以下的語句引用:

<script src="http://image.ccidnet.com/ad_files/network_index.asp?orders=1"></script>

這樣的話,每次有一個人訪問你的網站,伺服器就要執行並處理一次network_index.asp檔案,從資料庫抽取相應的資料,再輸出給網頁顯示,如果有幾萬個人同時訪問,就要執行幾萬次,後果就可想而知。建議在這些程式中將資料動態生成到一個network_index.js檔案中去,然後在首頁通過

<script src="http://www.179job.com/ad_files/home_daohang/network_index.js"></script>

這樣的程式碼來引用該network_index.js檔案。這樣,資料顯示的任務就交給客戶端的瀏覽器去做,不會耗費伺服器的資源,顯示速度自然就很快;前者所花的時間幾乎是後者的幾倍!

12Ajax調用盡量採用GET方法呼叫

實際使用XMLHttpRequest時,如果使用POST方法實現,會發生2HTTP請求,而使用GET方法只會發生1HTTP請求。如果改用GET方法,HTTP請求減少50%

13、減少頁面中的HTTP請求數量

比較直接的理解就是要減少呼叫其他頁面、檔案的數量。

A.我們在使用css格式控制的時候,經常會採用background載入很多圖形檔案,每個background的影象至少產生1HTTP請求,一般我們為了讓頁面生動活潑會大量使用background來載入背景圖,要改善這個狀況,可以採用css1個有用的background-position屬性來載入背景圖,我們將需要頻繁載入的多個圖片合成為1個單獨的圖片,需要載入時,採用以下形式載入即可將這部分圖片載入的HTTP請求縮減為1個。

B.採用Image maps,這個方法也比較常用,只是限於同1個區域使用。

C.Inline images,這個方法很少見到,但對於很小很簡單的影象卻是很實用的,相關語法標準參照:tools.ietf.org/html/rfc2397

14、新增檔案過期或者快取頭

對於同一使用者頻繁訪問的圖片、Js指令碼檔案等可以在ApacheNginx設定其緩衝 時間,例如設定24小時過期時間,這樣使用者在訪問過該頁面之後再次訪問時,同一組圖片或JS不會再重複下載,從而減少了HTTP請求,使用者訪問速度明顯有 所提升,同時伺服器負載也會下降。

15、避免採用301302轉向

301重定向主要是用於在域名的更改或者不帶www的域名定向到帶www的域名上,而302重定向可能我們的瞭解就比較少了,302重定向又稱之為302代表暫時性轉移,英文叫法為302 redirect,可以理解為暫時或者臨時重定向。表示一個頁面只是臨時的搬到另一個頁面上,從一些經驗老道的SEO高手處得知,302重定向還有內部和外部之分,同一個域名中兩個不同的頁面之間的的臨時重定向,這個成為為內部的臨時重定向。另一種則是在不同的域名之間做臨時的重定向,這種稱為外部臨時重定向。然而,基本上所有的搜尋引擎都只把它定義為內部的302重定向。對此,如果是內部的302重定向搜尋引擎並不會刪除搜尋結果中舊的頁面。

301重定向被認為是目前域名更改後以最友好的方式展現給搜尋引擎,也是業內用得最多的。在部落的網站中,之前有寫過很多關於301的文章,比如301重定向是否成功的驗證方法和wordpress部落格301重定向失效的解決辦法這兩篇文章,其中包括實現的具體方法和其中出現的一些問題的處理方式,您都可以參考一下,具體就不再多講。這裡補充說明一下的是301重定向後到百度的反應時間需要多久,也是很多站長都關注的問題,而百度Lee給出的說法是:“網頁的301跳轉是受Spider網頁更新週期制約的,這個更新週期目前來說可能比較長,我們也致力改進它”。很明顯,這是一個很模糊的說法。

目前有部分站長將302 重定向應用到黑帽技術上,利用302的外部重定向來進行“302劫持”,即將別人的內容劫持到自的頁面上,來獲得更好的權重,這些一般是在交換您的友情連結上需要注意的事情。

如果您是進行新舊域名的替換,那麼302重定向與301重定向的效果是一樣的,並且都可以將舊域名的權重傳遞到新域名上,然而302卻是以另外的方式——PR劫持來實現的。實現過程如下:

如果A302臨時重定向到BA隨時有可能改變主意顯示本身或者做其他改變,那麼當Googlebot(當然也包括Baiduspider)等搜身引擎蜘蛛抓取A的時候,實際上抓取的是目標地址B的內容,這樣就導致AB不同的地址有完全相同的內容,並且都被編入了索引,被認為是“利用重複的內容來干擾Google搜尋結果的網站排名”,網站受到懲罰也是在情理之中。

注:

302跳轉是暫時的跳轉,搜尋引擎會抓取新的內容而保留舊的網址。因為伺服器返回302程式碼,搜尋引擎認為新的網址只是暫時的。

301重定向是永久的重定向,搜尋引擎在抓取新內容的同時也將舊的網址替換為重定向之後的網址。

16、當頁面內容龐大到一定程度,可以採用分頁的方式展現

17、縮減iframe的使用,如無必要,儘量不要使用

18、使用多域名負載網頁內的多個檔案、圖片

記得有資料說明,IE在網頁載入過程中,在同1時刻,對同1域名並行加的HTTP請求數 量最高為2個,如果網頁需要載入的檔案數量超過2(通常遠遠超過..),要加快網頁訪問速度,最好將檔案分佈到多個域名,例如19樓,其js檔案採用獨 立的域名,據說百度的圖片伺服器數量在20臺以上。

19、把你的 .js 庫檔案地址替換成 Google CDN的地址

(google apis目前在中國地區訪問不是很穩定,不是很建議使用這條。)

隨著 jquery mootools js庫的使用需要載入的.js檔案越來越多也越來越大,通常傳統的網站是上傳到網站本身的目錄。但對於一個接近70KBjquery.js體積確實不利於網站響應速度的提升,此時就應該使用Google API .

把你的 http://www.cnblogs.com/jquery.x.x.js 替換為 http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js的意義在於當一個使用者訪問過使用 google api 的網站之後,再次訪問其他呼叫了該api地址的網站就不需要再次載入該檔案了。從而達到提速的目的。

不單是jquery庫,其他諸如mootools  yui 也可以使用這種方式。

推薦一個網站 ( http://scriptsrc.net/  ) 這個網站收集Google 提供的 js API路徑。直接點選複製就可以獲取到最新版的檔案路徑。

20、使用多域名負載網頁內的多個檔案、圖片,特別是外部呼叫的cssjs檔案

21、合理使用Flush

使用者端傳送瀏覽請求後,伺服器端一般要花銷200-500ms去處理這些請求,在此期間,使用者端瀏覽器處於等待狀態,如果要減少使用者等待時間,可以在適當的位置使用flush,將已經就緒的內容推送到使用者端。

22、Ajax採用快取呼叫

這個的使用可以參照Discuz論壇程式碼,裡面對於大量使用的Ajax呼叫都採用了快取 呼叫方式,一般採用附加特徵引數方式實現,

23、配置ETags

設定配置的推薦網站部落格:http://www.cnblogs.com/chenxizhang/archive/2013/05/11/3072898.html

24、養成良好的開發維護習慣,儘量避免指令碼重複呼叫

當前更新的css庫和js庫比較多,而且版本設定也相當多,所以使用的庫的檔案載入注意不能多次呼叫一個類庫的不同版本。

二、自己開發經驗中的一些積累

1、載入使用第三方類庫,使用源址連線

這樣做的好處是讓第三方檔案的載入提交給第三方網站伺服器的一些資源,從而減少了本伺服器的載入和解析的負載壓力,從而提高了網站載入速度。

2、儘量減少網站根目錄的檔案層次深度