Typecho 性能優化實踐

本文將從全棧角度分析typecho性能提高關鍵，並最終實現首屏時間縮短到1s之內
<!--more-->

文中服務器是用的是tsukaeru 日本2核1G內存 50G SSD 100Mbps網絡的KVM架構vps 到國內電信延遲約150ms
IO約170MB/s(超過1Gbps), UnixBench 雙核跑分1400左右
對於我的網站來講算是中等偏上的配置

後端

PHP

php版本毋庸置疑地影響着以php架構的typecho的運行
php7 相比於php5.x 性能的提高是質的飛躍
一樣的typecho版本分別在兩個版本的php下執行時間想去甚遠
在typecho根目錄下執行index.php時間對比

user@fqdn:# time php index.php > /dev/null 2>&1 
real    0m1.525s
user    0m0.180s
sys     0m0.036s
# php5.6.33

user@fqdn:# time php index.php > /dev/null 2>&1 
real    0m0.178s
user    0m0.067s
sys     0m0.006s
# php7.2.7

php性能直接影響TTFB(首字節時間)，趁早升級吧。

Opcache

Opcache是php緩存器，相似的還有eAccelerater等。
Opcache加入編譯能夠進一步加速高併發時php的效率
一般而言php官方源中已經加入Opcache，各大一鍵lnmp腳本或管理面板都會安裝Opcache
如下是屢次執行後再次執行index.php的耗時

user@fqdn:# time php index.php > /dev/null 2>&1 
real    0m0.093s
user    0m0.037s
sys     0m0.007s
# php7.2.7 第二次執行

能夠看出，此時php執行已經很是快了，如果在國內或是香港的vps上，TTFB已經能夠縮短到一般建議的300ms如下了

Mencached

一般大型php站點都會配置頁面緩存，這樣在高併發下的性能優點很是突出。
typecho做爲輕量級博客框架，並無自帶Memcached緩存的功能。好在插件老是萬能的
推薦一個TpCache插件
支持Memcache, Memcached和Redis，功能算是比較完善的了。
開啓緩存插件後高併發瓶頸從cpu性能變成了網絡帶寬(100Mbps佔滿)。

下圖是在loader.io壓測下1700併發一分鐘的結果



安利一下loader.io，這是一個sendgrid旗下的壓力測試工具，免費版最高可使用美每秒850新連接。

此時服務器cpu佔用仍維持在80%左右，nginx兩個worker process 各30% ，memcached 和php-fpm 均在10%如下
mysql爲0%

實際能夠達到的併發數大概在1000~1100併發左右，這對於我的網站來講，除非遭到ddcc，根本不可能有如此大的併發數。

Nginx

Worker Process

通常而言推薦保持和CPU核心數同樣，好比2。
默認的配置是1，若是在多核服務器上這會致使CPU僅利用一核。
也能夠配置爲auto。

TcpFastOpen

TFO 可使在session過時前再次發起tcp連接的時候不須要再次進行3次握手，直接傳輸數據，對於服務器放在國外的網站仍是頗有用的，tcp握手一般須要花費200ms以上的時間，這對於1s左右的加載時間仍是不可忽視的。

在Nginx配置的server段監聽端口後添加tcpfastopen=3

如

listen 443 ssl tcpfastopen=3 ;

Linux Kernel

一樣也有tcpfastopen 設置，開啓方法你們google一下

推薦開啓BBR tcp擁塞算法
對於Ubuntu 16.04, 能夠執行

echo 'net.core.default_qdisc=fq' >> /etc/sysctl.conf
echo 'net.ipv4.tcp_congestion_control=bbr' >> /etc/sysctl.conf

若是系統默認的文件打開數過小，能夠擴大一些
好比Ubuntu默認1024，高併發時可能會出現文件打開數過多的錯誤。
使用如下命令

ulimit -n 50000

能夠添加到啓動腳本以實現每次開機自動調整nofile限制。

前端

js異步加載

非異步加載的JavaScript會阻塞DOM load事件，由於js能夠修改dom tree 故瀏覽器在js執行時不會進行渲染。
可是其實不少js都是不操做dom樹的，好比用戶統計所用的js和頁面交互的js。咱們可使用 async 和defer 使得這些js的加載不阻塞瀏覽器渲染

CSS 壓縮

css壓縮是用gulp-minify 實現的，在主題發佈時已經完成。

PJAX

PJAX = pushState + AJAX
事實上就是ajax異步傳輸頁面內容後用pushState更新瀏覽器歷史記錄，統計數據等。
這樣使得咱們不須要從新渲染頁腳，側欄等頁面共有的部分。
實現方法能夠參考New Material主題。
盲目地全頁面pjax反卻是拔苗助長的。

Lazyload

非首屏圖片懶加載，也就是直到圖片進入視野中時才加載圖面，這樣在加載首屏時就能夠節省不少時間。
實現方法也能夠參考New Material主題。

最終效果

能夠看到，在這樣的網絡延遲下，DOM樹加載完畢僅在html下載完成後一百多毫秒，ttfb也是接近網絡延遲，服務器處理時間僅有二十幾毫秒。此次的性能優化仍是頗有效果的。

水平有限，若有錯誤之處歡迎指正。