古怪猴子最大奖:提升網站訪問速度–Yslow瀏覽器工具進行優化

独家真实传授pt古怪猴子玩法规律 www.cfrtc.icu Yslow是一套雅虎的網頁評分系統,詳細的列出了各項影響網頁載入速度的參數,這里不做多說。 下面我就總結幾點大家力所能及優化方法,分享給各位。 下面貼一下小博全新刷新的載入圖,下面…

Yslow是一套雅虎的網頁評分系統,詳細的列出了各項影響網頁載入速度的參數,這里不做多說。

下面我就總結幾點大家力所能及優化方法,分享給各位。

下面貼一下小博全新刷新的載入圖,下面文章中用得到:

我認為網頁優化主要分為兩類,個人稱之為軟優化與硬優化。軟優化主要包括:服務器緩存類與瀏覽器本地緩存類,這些優化主要是參數設置上的改動。而硬優化包括:傳輸線路,CDN,HTTP請求數,帶寬等基礎項目。

咱們小博客主要能做的,也是我想介紹的主要是軟優化類。

一、Make fewer HTTP requests(減少http請求數)

網頁載入中,每一個文件都是一個http請求,包括html,js,css,圖片等。而每一個文件的載入都需要DNS查詢(可忽略),建立連接,發送請求(可忽略),等待回復,下載文件,總共5個步驟,文件依次載入,時間就得依次增加,文件越多,時間越長。

下面看看俺的主機商小張童鞋的博客載入圖吧:

簡直是一條長龍,橙色JS,藍色HTML,綠色CSS,紫色IMG,雖然1秒多就響應,但最終載入時間為9秒。

而面對這樣的網頁,我們要做的是:

把CSS全都合到一個文件中去(復制粘貼就行)

把JS全都合到一個文件中去(復制粘貼就行)

主題中盡量少的使用圖片

如果必須使用圖片,把背景圖片全都合到一個文件中去(這個用photoshop合成,調用背景圖片時用background:url(all.png) no-repeat 幾px 幾px;來控制背景位置)

把框架網頁能去掉的都去了,每一個框架網頁等于新打開一個網頁。

優化好之后,整個頁面只有1個js,1個css,1個背景圖片和若干文章圖片頁面載入速度起碼提升2/3。

二、Add Expires headers(添加周期頭)

啥叫周期頭啊,其實就是給文件一個保質期。

沒過期的直接從本地調用,過期了后就得換新的了。

這個做起來簡單,直接在網站根目錄的.htaccess文件末尾添加以下代碼就行了(只有LINUX主機有.htaccess)

其中Axxxxxx是時間,單位秒。

 

<IfModule mod_expires.c> ExpiresActive On ExpiresDefault A3600 ExpiresByType image/gif A2592000 ExpiresByType image/png A2592000 ExpiresByType image/jpeg A2592000 ExpiresByType text/plain A604800 ExpiresByType application/x-shockwave-flash A2592000 ExpiresByType video/x-flv A2592000 ExpiresByType application/pdf A2592000 ExpiresByType text/html A600 ExpiresByType image/x-icon A2592000 ExpiresByType application/javascript A604800 ExpiresByType text/css A604800 </IfModule>

 

這樣設置后,第二次訪問就會直接調用本地緩存,僅僅HTML重新下載,速度飛快,如圖:

三、Configure entity tags (ETags)(配置實體標簽設置ETAG)

說實在的我也不知道ETAG是個什么東東,網上的解釋說他相當于一個標簽,來確認瀏覽器緩存里的元素是否和原來服務器上的一致,可是卻沒有說如何設置。終于找到了一篇如何設置的文章,可作者也是不太懂,作者就是萬戈大俠了。

他的方法是,在.htaccess中加入這句話。

FileETag none

說實話我并沒有明白為什么要設置成none,不過它起作用了,Yslow這項的評分到了A,肯定是有好處的,這就足夠了。

 

 

 

 

四、優化外部調用順序。(個人想法,也許有錯)

這一點是最容易被忽略的。

據我觀察,網頁載入的時候所有元素不是同時一起載入的,但也不是one by one這么著載入的,它有一個少數連接并發下載的情況,觀察文章頭部小博的載入圖,第1-3個圖片就是并發的。所以調用順序決定了載入順序,載入順序決定誰和誰并發。

我做過實驗,如果JS文件放在<head></head>中,他會跟隨HTML與CSS一同加載,然后等JS加載完成后才加載所有圖片,如果JS太肥了的話,這樣效率很低,JS要是卡住了,網頁更是死活不出來。如圖:

 

那么把JS放在body的footer中,情況就會改善很多,JS跟隨大批圖片一起載入,共用時間,如文章頭部小博載入圖。

而且最重要的是,html載入完畢就可以顯示DOM元素了,不需要等待JS完畢再顯示。

五、服務器緩存

老話題了,WP一般使用插件緩存,我使用的是WP-CACHE,它可以使平時需要1秒左右載入的HTML在幾十毫秒內載入。

配合圖片本地緩存,二次打開的頁面基本是秒開。如圖(這就是小博的平時載入速度了):

六、其他

其他就剩下一些零碎的優化了,這些影響比較小。

比如把主題中所有不經常更改內容的php語句直接改成文字,比如博客名神馬的。

還有,CSS,JS壓縮,小一點就快一點。

本地DNS的選擇(在網卡屬性里),第一次訪問時,DNS-LOOK-UP(DNS查詢)也是占了相當時間的,如果你的DNS的ping較高。

COOKIE-FREE 域名設置:意思就是每次建立連接的時候,客戶端都要先發一份COOKIE到服務器去,而設置COOKIE-FREE后就可以省下這點時間了。個人覺得沒多少時間,不發COOKIE后,用戶評論信息還要自己寫,體驗不好,不建議設置。

為您推薦

返回頂部