網站性能指南(一):概述

來源:互聯網
上載者:User

仲介交易 HTTP://www.aliyun.com/zixun/aggregation/6858.html">SEO診斷 淘寶客 雲主機 技術大廳

【概觀】

什麼使我們的網站變慢?

Http 協定

通過更好的性能省錢和賺錢

效能規則

【什麼使網站變慢】

對於大多數現代的網站,僅僅有10%-20%的回應時間是用於生成和載入html document的。

那麼,其他的時間用於載入什麼呢?確切的說,如下:

css

javascript(jquery,plugin 等等)

images

讓我們使用一個工具去看看-Fiddler (HTTP://www.fiddler2.com/fiddler2/)

首先打開fiddler,然後使用瀏覽器訪問 www.microsoft.com

這時候我們可以看到fiddler監控到用戶端與微軟網站伺服器之間的交互情況如下圖:

  

注意fiddler 右邊的選項卡,有一個timeline。 載入default.asp話費了大概1s的時間。 讓我們全選這些行。 再去看看timeline,如下圖

  

這時候我們根據資料就可以證明前邊的觀點,對於某個網站來說,80%的時間是用於載入css/JS/image的。

【Http 協定】

對於HTTP協定的理解是非常重要的,因為它定義了web 瀏覽器和 web 伺服器如何交互。

Hypertext Transfer Protocol

對於這點來說,最重要的是text,它不是基於二進位的協定,而是基於text的。

協定是1997年1月在 RFC(Http1.1)定義的。

請求/相應 模式。 用戶端瀏覽器發送特定的request,伺服器返回response

Header 和body。 每個request/response 有header和body

以下是 HTTP協定的內容。 我十分推薦你們閱讀它:HTTP://tinyurl.com/8395lq

HttpRequest

我們使用fiddler觀察一下我們訪問微軟的HTTPrequest。

選中第一個記錄。 右邊選項卡依次->Inspecotrs->Raw

  

我們簡單分析,

Get指明瞭url和HTTP的版本。

host指明瞭host的位址。

accept-language指明瞭瀏覽器使用的語言

accept-Encoding指明瞭是否可以使用對瀏覽器到伺服器之間的資料進行壓縮。

HttpResponse

下面我們來看看剛才我們請求的回應。

我在fiddler中選中的是第12行資料,選中右邊選項卡->Inspecotrs->Raw

Http/1/1 200 OK。 是告訴大家,一切運行良好。 200是一種狀態,如果遇到問題可能會是404,500等。

其他細節,大家可以自己查一下資料。

【通過更好的性能省錢和賺錢】

大家都可以明白。 提升網站的性能,可以讓使用者更加滿意。 而這也能讓我們省錢和賺錢。

省錢的辦法:

使用更小的頻寬

更少的伺服器數量

賺錢的辦法:

增長的銷售和流量

-每增加100毫秒載入Amzon.com 會減少銷售額的1%.web

-當google maps 的主頁大小從100KB減少到70-80k時,流量在第一周會增在10%,在隨後的3周會增長到25%。

-google 已經根據你網站的性能去説明決定搜索排名。

對於網站性能對流量和銷售產生的影響請參見相關文章《web性能心理學》HTTP://www.websiteoptimization.com/speed/tweak/psychology-web-performance/

【效能規則】

減少HTTP request

如何減少HTTP request呢?我們根據上邊提到fiddler偵聽到的HTTP request 得知,好多次請求是去獲取css,javascript,和image的。

首先我們先來看看一個網站:

  

它是一個普通的網站他可以使用jquery來彈出圖片,我們用fiddler 來試試它。

  

我們可以看出。 他包含了一些css檔,也使用了jquery。

讓我們看看這個網站的另一個版本。

樣子是一模一樣的,我就不show圖了。

讓我們看看fiddler 又幫我們抓到了什麼:

  

js和css檔都變成1個了。 我們把上邊的js檔合併成1個js檔。 這樣我們就減少了HTTPrequest的次數。

2.發送盡可能少的資料

我們回到fiddler。 查看第一個網站的jquery檔「jquery-1.6.2.js。

  

它的普通版本是236k。

第一個網站需要載入js的總大小是279k。

而第二個網站需要載入js的大小是50.8k。

我們做了什麼呢?只是把js檔裡的白空格去掉了,就是對js檔的壓縮。

css檔也如此。 在最後的product版本上,我們使用合併的檔可以減少HTTPrequest次數。 當然在debug的時候我們要保留空行增加代碼的可讀性。

關於壓縮js的工具我們在網上可以找到很多,就不列舉。

3.減少交互的次數(適當使用緩存)

讓我們刷新一下第二個網站,並觀看fiddler。 我們可以發現,第二次載入至向伺服器獲取了default.aspx。

  

並沒有重新載入js、css和圖片。 因為瀏覽器已經替我們緩存了那些檔。

原文:HTTP://www.cnblogs.com/techborther/archive/2012/08/01/2618506.html

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.