[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

對於讀者來說網頁開啟速度可說是影響整個觀感好壞的主要因素,因此對於網站站長而言如何優化網站速度成為重要的課題。網路上提供不少方便好用網站速度檢測服務,今天要推薦 Pingdom 網站提供元件載入速度檢測工具,檢測項目詳細、多樣,並且能夠將測試各個項目給予分數,站長們可以透過這個網站分析資料結果,找出拖慢網站速度、單一檔案大小過大元素,並且將它們給優化、移除,趕快藉由 Pingdom來幫網站做健康檢查,找出拖慢網站速度的元凶吧!!


[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

網站名稱:Pingdom Tools

網站網址:http://fpt.pingdom.com

網站連線速度過慢往往是因為本身載入過多的外部服務,因而拖垮網站瀏覽速度。雖然說這原因和網站伺服器放在哪裡也有絕對關聯,但是如果你是租用台灣虛擬主機卻發現網站開啟速度常常很慢甚至是卡住,又該如何找出問題呢?? 此時可以透過 Pingdom Tools 網站來進行"健康檢查",幫你找出拖速度的兇手。Pingdom Tools 提供詳細檢測資訊,可以讓站長們找出拖垮網站速度元素,比起 "Google Page Speed" 分析結果還完整,可以確實找出哪些元素檔案大、讀取時間過長 … 等問題,讓讀者瀏覽網頁有更快的速度。

開啟 Pingdom Tools 網站,在框框內輸入欲檢測網站網址,下方 [settings] 可以展開設定是否將測試結果資料儲存並公開,此外還可以選擇檢測伺服器位置,調整好後直接點[Test Now]就會開始進行"健檢"啦 ~

 

[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

 

沒多久就會顯示網站統計數據。結果會針對網站做一個評分、顯示請求連線次數,頁面檔案大小、載入時間數據;選擇不同伺服器測試出來讀取時間結果可能會略有不同,我的部落格顯示「Your website is faster than 31% of all tested websites」表示開啟網頁速度算是快的了,看來之前優化成效有出來。

 

Perf.grade:評分,滿分100。(越高越好)

Requests:請求連線數。(越低越好)

Load time:載入時間(越低越好)

Page size:網頁大小(越低越好)

 

[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

 

Waterfall 網站連線狀況:

 

在【Waterfall】頁面會顯示出伺服器連線請求次數、反應時間,雖然說測試伺服器是在國外,連台灣網站可能會有一點慢,但我想應該不會差太多。基本上建議網站所使用的元素越少、檔案大小越小連線速度就越快,畢竟對於伺服器來說一次可以請求開啟頁面元件個數是有限的,如果太多的話會導致 Loading 時間過長,以開啟網頁到讀取完整個頁面 (包含圖片秀出來) 來說我想約 3 ~ 5 秒就算快了,如果超過這時間都還在轉圈圈的話,我想就要優化一下了。

 

優化方式:

 

優化方式:我建議可以點選上圖 [sort by file size] 以及 [sort by loading time] 將檔案過大、讀取時間太長的元素給優化或移除,像是會發現可能部分文章圖片檔案過大會開比較久,可以使用圖片壓縮軟體將它給壓縮,或者是有些 "jQuery.js 加載" 不需要額外載入的可以使用 Google 提供 Api 就可節省主機流量;我當時就是發現自己網站側邊欄放太多 Javascript 特效外掛導致卡卡的,不但吃主機流量而且會拖速度,當下一直找不出原因,但後來透過 Pingdom Tools 檢測後發現問題後馬上改善速度就快多了,這其中有不少眉眉角角可以探討,大家可以摸索看看。

 

[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

 

Performance Grade 效能評等

 

[Performance Grade] 則是分析網站整體頁面開啟效能的分數等級 (滿分100),像這裡我們發現 "Leverage browser caching" 只有給 44 分,這表示 WordPress 暫存這部分做不好,實現方式除了可以藉由 CDN 以外,還可以透過 .htaccess 來優化,參考教學:網址

 

[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

 

Pages Analytics 頁面分析

 

[Pages Analytics] 部分則是能夠透過圖表查看頁面中各類型元素所占用的時間百分比。以我的網站來說因為圖片比例比較多,所以 Image 檔案大小、請求時間所佔的比例就比較大,但基本上我是已經 Resize 過並且是另外使用"圖床",因此速度比起以往來說加快許多,如果要"優化徹底"一點不想讓台灣主機吃太多不必要的流量,我建議把佈景主題內的檔案像是 "style.css"、"jquery"、".js" 等檔案搬到國外虛擬主機圖床,就不會常發生台灣主機流量爆掉的冏境啦!!

別看那檔案大小可能只有 15 ~ 20KB而已,假設每日PV 2000 ~ 3000 左右,等於是 20KB*3000PV*30/1024=1757MB/1個月,這對於台灣主機流量來說佔很大的一部分,如果可以將它搬到無限流國外虛擬主機將會很省。使用者可以根據這些數據對網站的內容、元素做一些刪減動作,便能達到不錯優化網站速度效果。

P.S:如果主機本身放國外無流量限制,基本上無需處理!! 但流量大還是得要注意 CPU Time 問題。

 

[教學] Pingdom 網頁載入速度測試工具,找出拖垮網站速度元凶

 

History 歷史報表

 

[History] 最後這一個項目則是如果在一開始使用者測試前有設定"儲存報表並公開",測試完結果會記錄在網站伺服器上,日後無論是誰只要測試到相同網站,都可以查到以前分析過的網站速度、讀取時間,可以讓站長們掌握網站優化後是否真的有達到其效果;以我的網站為例發現 3/13 日報表顯示讀取時間過長,我猜想是因為美國測試伺服器問題吧,近日發現偶而會測試時間過長、卡住沒有結果情況,多試幾次就好啦 XDD

 

網站名稱:Pingdom Tools

網站網址:http://fpt.pingdom.com

 

留言板

  1. Avatar for lavi lavi表示:

    請問那個Connection Error有辦法在這個網站上查到是哪邊的connection出問題嗎?
    因為我翻了一下有點看不出來耶,謝謝你!

    1. Avatar for 阿福 阿福表示:

      能否上傳圖片讓我知道問題
      光靠文字敘述無法得知太多訊息 …