剛買主機的時候興奮異常,測試速度也快感爆棚。安裝 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 。而每一種格式又可以有不同的質量選項,做在質量和體積相平衡的選擇。
減少外部資源的使用
外部資源就是不在自己伺服器上的資源。使用太多的外部資源會遇到以下問題:
1 、解析 DNS 的時間變長
每一個域名都是需要 DNS 解析才能夠正常工作。如果網站上的內容同時需要載入 a.com,b.com,c.com,d.com 這些網站的資源,那就需要更多的時間去分別解析每個域名的 DNS,建立連線。而同樣的,如果自己的站點是 a.com,如果同時載入 1.a.com,2.a.com 這些類似的域名,也同樣會加長 DNS 解析時間。外部資源是不可能完全避免的,但能少則少。
2 、外部資源的載入速度不可控制
這主要是針對一些國外站點的內容而言,比如 fickr,twitter 等,因為眾所周知的原因,載入它們的資源會明顯減慢載入速度。而國內的站點相對來說速度還算是比較快。
減少資料庫查詢,或使用資料庫快取外掛
資料庫查詢時間就像是在問資料庫:「幫我在那堆動作片裡找張蒼老師去年 10 月出演的片子」 。資料庫就開始找,找到了之後拿給你。如果同時向它要 100 個,那麼這個找和反饋的時間就明顯拉長了。
而許多的外掛都需要資料庫查詢,上面關於外掛和主題的部分也提到了最佳化程式碼儘量減少資料庫的查詢次數。如果不懂,可以考慮使用資料庫快取,它能夠將資料庫的查詢內容快取起來,就好像提前知道我要找什麼,然後把這些東西提前整理好,當我需要的時候就不用再去那堆動作片裡面瞎翻,而是可以立即給我。比如有名的資料庫快取外掛 DB Cache Reloaded,但這個外掛早已停止更新。國外網友在它原有的基礎上開發了另一款 DB Cache Reloaded fix,效果還是不錯的。
但需要注意的是,資料庫快取外掛不要和靜態化快取外掛一起使用。因為兩者都是資料快取內容減少查詢,如果一起用就等於重複勞動。
使用頁面靜態化快取外掛
靜態化快取外掛和資料庫快取外掛的原理差不多,都是將內容提前整理好並生成靜態的檔案,當需要的時候直接拿出來,而不需要再去查詢、生成,浪費時間。快取過的靜態檔案基本上可以等同於一張靜態圖片,不需要執行太多複雜的內容。我個人推薦的頁面靜態化快取外掛是 WP Super Cache,我愛水煮魚曾經力薦過它,功能很強大 (水煮魚的介紹),操作也很簡單。大貓有寫有使用教程之含笑五步顛。
使用 GZIP 壓縮網頁
使用 Gzip 壓縮可以減少網頁體積 20% 甚至更多 (靜態資源除外) 。通常大部分的 WP 主機都能夠支援服務端的 Gzip 並且可以自動壓縮。如果伺服器沒有自動進行頁面壓縮,就需要自行開啟。上面提到的 WP Super Cache 包含了這項功能。
最佳化部落格文章圖片
就和最佳化主題背景圖片一樣,部落格的文章圖片也是需要進行最佳化的。如果會 Photoshop 自然是最好,調整圖片合適的尺寸,然後輸出 web 格式為合適的質量,基本上可以減少 30% 的體積。如果不會 PS,一些線上圖片壓縮網站也是額外選擇,或者使用 Smushit 這類的圖片壓縮外掛,雖然效果不如 PS 直接調整圖片質量那麼給力,但總歸能少點兒體積。
以我自己的部落格為例,我使用的是 media temple 美國主機,在未最佳化之前,完整頁面的載入速度為 13 秒。而儘可能的最佳化之後載入速度降到 6 秒左右。基本上快了一倍。不過實話實說,最重要的還是主機自身速度 (各類主機商開始喊冤中。),但個人部落格往往不可能投入大量的金錢用於購買高科技主機,有心情折騰部落格的大多身處水深火熱之中。。所以平民化的國外主機成為了普遍的選擇。國內主機雖然夠快,不過需要備案,這是個很坑爹的事實。在如此的環境之下,儘可能的從自身的內容部分去最佳化,是個好選擇。
使用 CDN 分散式網路加速靜態檔案
這是奢侈的選擇,沒必要但可嘗試。國外主機的速度相國內主機而言速度肯定略滿,美國主機這種遠在大洋彼岸的就更不用說了。如果有米,可以考慮使用國內的 CDN 服務來加速靜態檔案 (比如文章裡的圖片之類),CDN 就等同於把同一個檔案即時快取到 N 個伺服器中,當訪問部落格中的某個圖片時,CDN 會自動分析訪客的網路線路,並選擇最近最快的伺服器返回圖片。而靜態資源在部落格中的頁面比例中大概佔了 60-90%,使用 CDN 分散式網路能夠有效的提速。目前國內有 Webluker 和又拍雲端儲存、又拍圖片管家這三種 CDN 比較適合普通站長,價格也相對便宜。比較推薦又拍雲或者又拍圖片管家,因為國外主機往往都沒有備案,而又拍雲可以提供 upyun 的 3 級域名。 webluker 因為原理不同,這必須源站繫結已備案的域名 (丫的我備案了還找你幹鳥) 。使用 CDN 服務的時候,可以這樣做:選擇空間較小的國外主機 (300M 空間,10G 流量以內)+圖床型別的國內 CDN 服務,這樣總體的搭配價格在 200 元以內,價格不貴,但提速效果絕對明顯。
至於又拍圖片管家和又拍雲端儲存 2 者相比較,我個人更傾向於又拍雲端儲存,自定義方面更強 (比如繫結域名免費、可儲存 HTML/JS 等非圖片檔案、支援 FTP/API 、 404/403 提示圖片等、 Token 防盜鏈等) 。而又拍圖片管家更適合純粹的圖片儲存,不過流量和儲存空間相對要略大些。最近華為網盤有出了個直鏈服務,價格貌似比較低,但個人不是特別看好,畢竟還是基於網盤的功能型別,即便是有了 API,但左看右看都有點蛋疼。
有人會罵街:那我不如選擇個國內主機或大流量的香港主機,幹嘛還要額外花錢用 CDN 。這是正確的,但其實這又不是完全正確的。
1 、國內備案現在很麻煩 (郵寄身份證,材料啥的,折騰無止境,隨時被喝茶。由於現在備案都是直接接入主機商備案系統,最坑爹的是現在有些主機商居然還要求付錢備案。)
2 、國內主機價格偏貴,質量卻不一定好。
3 、即便是國內主機或香港主機,線路速度和 CDN 分佈線路速度相比還是有很多差距 (特別是對於單線主機而言)
4 、如果你真的選擇國內主機,那麼國內主機+CDN 才是帥氣的日天手法。
最佳化的效果
假如你問我:「我只是一個小部落格,訪問流量也很小,有必要這麼折騰嗎?」 但據我所知,用 WP 做獨立部落格的大多都是折騰+蛋疼狂,再引用大貓的一句話:搞這些純粹為了自 High,和流量沒關係,開啟自己的網站快個 6 、 7 秒不是一件很爽的事咩?
以我自己的部落格 (acora.cc) 為例,減少了外掛的使用和最佳化了主題之後,再配合香港主機 + MT ProCDN + 又拍雲端儲存 CDN + WP Super Cache 外掛,頁面的載入速度從以前的 15 秒到現在的 2.2 秒 (4M 電信測試),減少了 80% 以上的載入時間,基本達到高 chao 了。國內的高價低質主機們去死吧。
