Gravatar 速度優化,減少對不同伺服器的請求

Gravatar是一個免費的頭像服務,對於沒有提供大頭貼的網站,可利用Gravatar的API,讓網站擁有大頭貼功能。使用者只要利用信箱設定,即可擁有個人的頭像,這服務早已內嵌於WordPress系統。但是根據Google Page Speed Online對於網站的分析報告中顯示,這個頭像服務會調用不同的伺服器之頭像來顯示於網站上,但是這樣其實不太好。

將頭像分散於各伺服器,對於Gravatar提供頭像服務的網站來講,是一件好事情,因為網站可以分散伺服器負擔,可是對於使用這服務的網站來說,這樣的做法,會讓網站對於太多的伺服器做請求,同時也會讓網站速度變慢,請求越多,等待時間就越多,所以我們可以來改個程式碼,讓所有頭像使用同一個伺服器請求,減少不必要的連線。


關於Gravatar更改伺服器的方法,在對岸的一些部落格中,其實都有很多教學了,主要是因為頭像常常會被GFW萬里長城防火搶擋住,造成頭像連線失敗。常見的修改方式,都是修改系統檔案以解決頭像被牆的問題,但我們則是要利用佈景主題中的functions.php檔案來變更站內輸出頭像,使用統一指定的伺服器。

解決方法目前有兩種,一種是可以透過語法,將所有頭像快取到自己網站上,使用自己網站提供,速度會快一些,但這樣也會增加網站流量,如果訪客的瀏覽環境沒有被牆,其實不建議這樣做。建議做法是利用語法,強制更改Gravatar請求的伺服器,讓站內的頭像都連至同一伺服器,以加快一些些網站速度。

第1步  Gravatar頭像是什麼?那你可以看看使用WordPress架設的網站,他們留言區都是使用這個服務所產生的頭像,換言之,頭像都是外連服務。

Gravatar 速度優化,減少對不同伺服器的請求

第2步  把文章網址丟到Google Page Speed網站檢測,在「從相同的網址提供資源」中,我們會發現Google建議我們更改伺服器位置,以前少請求的往返時間。

Gravatar 速度優化,減少對不同伺服器的請求

第3步  Gravatar的頭像有許多伺服器,目前大致上有以下幾個。頭像常常會分散至各個伺服器載入至網站。有注意到以下的差異了嗎?雖然都是同一個頭像,可是實際在網站留言區塊輸出的時候,有些人可能是www,有些人可能是2,為了解決這樣的問題,我們可以統一伺服器,把藍色或是紅色的位置全部統一。(紅色同一IP、藍色同一IP)。

  • http://www.gravatar.com/avatar/d0025bd76ce573ca7e226484b9ed5d55
  • http://en.gravatar.com/avatar/d0025bd76ce573ca7e226484b9ed5d55
  • http://0.gravatar.com/avatar/d0025bd76ce573ca7e226484b9ed5d55
  • http://1.gravatar.com/avatar/d0025bd76ce573ca7e226484b9ed5d55
  • http://2.gravatar.com/avatar/d0025bd76ce573ca7e226484b9ed5d55

第4步  修改伺服器方法有兩種,一種是修改「/wp-includes/pluggable.php」檔案,不過在此推薦使用functions.php修改取代法,作法如下:開啟佈景主題的functions.php檔案,在適當的位置加上以下語法:(語法參考:PHOETRY)

function change_gravatar_server($host){
    return preg_replace('/\d+(?=\.gravatar)/i','0',$host);  }
add_filter('get_avatar', 'change_gravatar_server');

以上語法,其中的「0」,修改成你要使用的伺服器位置,目前有「www、en、0、1、2」可以選擇,通常建議設定為0。設定好後,儲存並上傳就可以了,再次回去檢查應該就沒有那個項目囉!

如果嫌棄加入functions.php的方法太麻煩,您可以直接利用mg12介紹的「Gravatar Fixed」外掛解決。前面提到,關於頭像快取(緩存)到網站伺服器的做法,可以參照Willin Kan的教學。另外在第四步驟中也有提到說可透過修改系統檔案「/wp-includes/pluggable.php」更改伺服器的做法,可以參考林木木的教學