Pingdom 網頁速度優化參考工具使用心得

因為前一陣子的外掛實驗終於告了一個段落，也感謝大家願意容忍因為每天不斷增加、改變外掛而變慢的「電腦玩物」。經過實驗階段後，接下來的電腦玩物也將邁入一個比較「正常」的外掛使用方式，我還是會繼續嘗試新鮮有趣的部落格外掛，電腦玩物也仍然會繼續擺放著一些我自己很喜歡、覺得有用處的外掛；但是我也會注意到整體的管理與優化，然後我也不會像前一陣子那樣動不動就改動整個部落格的佈置，即使要改，也會盡量在深夜時分比較少人上線時再改。

好啦，其實這篇文章只是想要簡單談談上禮拜天調整部落格的一些心得，不是很專業的調整，但是算是一個初步的優化，記錄下來也可以當作日後的參考。其中我主要運用的工具和參考的文章如下：

• Pingdom Tools FullPage Test：http://tools.pingdom.com/fpt/
• 走過的、學過的、看過的：[ 網路 ] 你的網站到底是慢在哪裡？
• Fred Wang 網誌：精簡網頁的方法(Simplify Your Web Pages)
• LightSpeed Website Optimizer：http://www.divshare.com/download/2485881-047

因為我用的方法很簡單，雖然效果也不大，但是也應該可以適用於大多數人簡單的部落格優化。首先我利用「Pingdom」這個網站提供的FullPage Test工具來測試整個部落格的網頁載入流程。pingdom tool可以告訴我們每一個網頁元素的載入順序和所花費的時間，而且還會用一個長條圖表來告訴你比較後的結果，我們可以很直覺的找出長度較長的幾個元素，那就代表這些網頁元素「相對」之下要花更久的載入時間。如此一來便可以輕易的找出耗效能的環節了。

然而是不是把最耗效能的環節移除就好了呢？我對這一點到是抱持了保留的態度，因為我們還要考慮許多其他的因素。影響網頁載入效能大概會有以下幾個原因：

部落格平台：

即使像Blogger這種算是很簡潔的BSP，有時候還是會因為一些問題而導致速度變慢，甚至當機。所以BSP本身穩定性，或是個人架站主機的效能，算是我們無法控制的不確定因素。

外掛：

各種放在部落格中可見、不可見的Widgets，當然都會影響到網頁載入的效能，但是考慮到外掛本身可以帶來的價值和用處，我自己會適度的做一個取捨。而且目前許多的外掛其實會讓自己盡量的不影響網頁正文的載入，也就是會等到網頁文章都載入完畢後才開始載入，這樣的話即使這個外掛載入比較慢，起碼訪客仍然可以先瀏覽正文。

以電腦玩物為例，像是Plugoo確實有時候載入比較慢，但是安裝後我常常可以收到訪客直接的回饋，甚至還有我介紹過的工具的作者直接透過Plugoo來和我對話；或者像Spotplex有時候因為其伺服器的關係會卡住，但是查看流量統計會發現確實有些訪客會透過Spotplex來繼續閱讀站內其他文章；而像ClickComments的負面評價、Who’s.amung.us的線上人數、黑米和funP的推文按鈕、廣告等等，雖然載入都不快，但是它們其實也都不會影響到正文的載入，而且它們提供的功能也讓我決定將其留下。

圖片：

這是一個和外掛同樣容易影響到網頁載入效能的原因，而且有時後圖片的影響還超過外掛。在一開始利用pingdom檢查時，我發現佔用電腦玩物最多載入時間的其實是圖片，這是因為我的文章中會放入大量、大張的教學圖片，本來是想說可以提供訪客更多參考，但是如此一來卻會「真正的」影響到正文的載入。

我有實驗過將外掛全部移除，留下原本Blogger的版型，結果發現網頁文章的載入並沒有快多少，因為原因其實就卡在教學文章裡大量的圖片。但是提供圖片也會有它的用處，所以接下來我會盡量精簡圖片數量與體積，讓正文的載入可以更順一點。

然後相信不少朋友也發現了，我將版面四周原本許多小張的圖片檔全部都移除了，包括原本電腦玩物標題的圖片。因為我想要留下有用的外掛，也不想將已經發表文章內的圖片移除，所以折衷的辦法就是把側邊欄裡原本很瑣碎的小圖片都移除掉，這些圖片雖小，但是每一張都要多花一點載入時間，綜合起來其實就累積了不少對整體效能的影響，移除後起碼側邊欄的載入會比以前順暢一點。而某些小圖片提供的RSS訂閱或書籤收藏功能，其實都可以用FeedBurner本身的按鈕，以及我每篇文章下方的FeedFlare來取代。

HTML：

這個可能就是比較麻煩的部份了，精簡HTML，把無用的部分去除，讓程式更簡潔，當然就可以增加網頁的載入速度，但是也要花更多心力來檢查調整。所以我目前用了一個最簡單的方法，就是下載這個「LightSpeed Wibsite Optimizer」，它「號稱」可以自動幫你去除一些HTML、XML檔案裡不必要的tag及符號。

於是我抱著試試看的心理，先到Blogger後台下載網頁的xml檔案，透過這個程式來優化，結果檔案的體積確實有減少，然後我再將優化過的xml上傳回Blogger，似乎也沒有造成什麼問題。利用Pingdom來檢測後，也測出HTML的大小有縮小，載入速度當然也「稍微」快了一點點（只有一點點而已）。我想這種自動優化應該多少還是有風險，我自己也不是很有把握它的安全性與效果，所以提供來給大家參考，至於要試用的話，最好還是先做好安全備份措施。

以上就是我這次簡單調整版面的小小心得，順便也向大家推薦一下Pingdom這個好用的參考工具網站。我想我以後應該會朝著精簡圖片的方向來作主要文章載入速度的優化吧！