剛買主機的時候興奮異常,測試速度也快感爆棚。安裝 WP,折騰各種主題,折騰各種外掛,寫各種博文。一段時間之後,當初的爆棚感變成了蛋疼感,主機速度似乎越來越慢,當初瞎了眼?做了小白鼠?甚至有些人選擇了更換主機。

以上是我曾經遇到的疑惑,很多人或許都有過類似的悲劇。大多數人會把問題往主機商身上扣,認為其服務越來越不穩定,賺了咱們 100 元/年的血汗錢。當初給蛋糕現在給窩頭。而河對岸的主機商卻委屈流淚喊冤發狂。

不錯,主機自身的速度的確是影響網站速度最重要的一點,但除此之外,還受到其他很多方面的影響。這就是為什麼剛剛安裝 WP 的時候感覺很快,用了一段時間後卻變慢的原因。 Willin Kan 曾經寫過一篇 《WordPress 真的飛不起來》,有些人似乎對這文章產生了誤解。全文其實並沒有說 WP 自身程式設計的效能問題,而主要提到了外掛,資料等對於 WP 速度的影響。這就好比 Windows 系統,其實挺好用,但因為各種各樣的應用軟體設計得比較坑人,導致電腦越用越慢,使用者反倒給比爾蓋茨扣上了二百五的帽子。再回頭看 Willin Kan 想要表達的內容或許是: WordPress 並沒錯,罪魁禍首是在各種各樣的附加功能所導致。 (個人 YY 。)

那該怎樣做?先看張圖片,這是百度網站速度診斷工具對於網站速度載入中的各項指標進行的分析與權重:

百度網站速度診斷分析

如果把這些內容放到 WP 上面來,可以歸納為以下更為直觀的方法:

減少外掛的使用

這是首要的一點。有句流行的話說過“ 能用程式碼解決的決不用外掛”,但實際情況是大部分的人往往都沒足夠的程式碼知識,更不可能做到對嗎,每個外掛的程式碼化,所以這是典型的站著說話不蛋疼。而更好的選擇是能不用的外掛就不用,一了百了,落個清淨。大部分的外掛都會進行資料查詢與生成,這在頁面生成過程中將耗費時間。如果剛好你的主機限制比較嚴格的話 (為了均衡資源使用率),這個時間甚至會變得比較長長長長長長。

WP 外掛大多都會在頁面中載入各種各樣犀利的 CSS 和 JS,而網站最佳化中有 2 條內容是:

1 、減少 HTTP 請求,每一次對於 JS,CSS 等檔案的訪問都是一次 HTTP 請求。外掛用得少,HTTP 請求數自然就更少。

2 、合併 CSS 和 JS 檔案:減少 HTTP 請求的首要辦法是合併 CSS 和 JS 。 1 個 10kb 的 js 和 2 個 5kb 的 js 載入所耗費的時間是不一樣的,而且明顯後者會長一些。特別是檔案都在同一域名下這樣的情況更為明顯。而外掛的 js 和 css 都是獨立的,如果 10 個外掛每個都生成 1 個 js+1 個 css,再加上主題的話,css 和 js 的數量可能會超過 30 個。這… 。太有才了。

雖然也可以自己手動合併這些外掛的 CSS 和 JS 到主題中,但這樣的做法明顯很繁瑣很笨搓。

許多人還聽過那句“ 刪除不使用的外掛“,但大家都不知道為什麼。這樣做是有好處的,因為 WP 在每一次的頁面訪問時,都會判斷外掛的使用情況。讓 WP 做更少的判斷就等於做更少的資料查詢。解放它的負擔吧。

謹慎的選擇主題或手動最佳化

如今 WP 主題越來越絢,面對這些精美誘惑的同時需要保持謹慎。許多主題雖然漂亮但在最佳化方面做得並不算好,各種 JS,各種 CSS,各種背景圖片,各種空行,各種冗餘,這些都會影響到載入速度。不過這並不意味著不能選擇絢麗的主題,而是主題應該要基本滿足以下要求,或者你手動修改它使其滿足以下要求:

1 、合併 CSS 和 JS:將多個 CSS 合併為 1 個。將多個 JS 合併為一個,這樣做可以減少 HTTP 請求,加快渲染時間和載入速度。

2 、合併背景圖片:使用 CSS Sprites 將大部分的背景圖片合併為 1 個檔案,同樣是減少 HTTP 請求,減少檔案體積,加快渲染時間。

3 、減少資料查詢:能用 HTML 直接輸出的地方就不要搞個資料查詢。

4 、合理的 JS 和 CSS 位置:合理的將一些 JS 和 CSS 放置到網頁底部。

5 、最佳化主題的背景圖片:打個比方,畫面同樣為純灰色的 PNG 圖片和 JPG 圖片相比較的話,PNG 圖片明顯體積更小。又比如說,一個質量為 70 的 jpg 圖片和一個質量為 90 的 jpg 圖片從視覺上看差距並不大,但 90 質量的體積卻可能高出 50% 甚至更多,這在大圖片上尤為明顯。通常來說,色調單一或者需要透明背景的圖片使用 PNG,相反則使用 JPG 或者 GIF 。而每一種格式又可以有不同的質量選項,做在質量和體積相平衡的選擇。