我的 WordPress 全端優化經驗 / Complete Guide of Optimizing WordPress_蕭宗仁 / Josh Hsiao

這場議程將告訴你如何不花一毛錢提升 40% 業績。網路上的商業競爭，當你的網站載入時間超過 3 秒，40% 的使用者會選擇跳出不再等待，意味著你花大錢廣告，讓客戶點擊你的網址，其中有 4 成廣告費都砸在水裡。 比比看，F1 一級方程式賽車，維修站換好四顆輪胎只要 1.91 秒，你的網站顯示要幾秒？議程內容將包含：

全站 AMP 網頁 + Server-side rendering + CDN + Premium DNS
Nginx + Fastcgi Cache + Redis Cache + HTTP2 (or HTTP3)
Php-fpm workers
Brotli 壓縮 + TLS1.3 0-RTT
Ngx_pagespeed
New Relic rpm 偵測速度瓶頸
資料庫查詢最佳化
Plugins 設定最佳化

Transcript

1. WordPress 全端速度優化 紅米青年旅館 JOSH Line討論群
2. 天下武功 唯快不破 • F1一級方程式賽車，維修站更換四顆輪胎只要1.88秒， 你的網站載入要幾秒? • 網站的搜尋引擎排序和載入速度息息相關 • 當網頁載入時間超過3秒，40%的使用者會選擇跳出不再 等待 • AMAZON 自身估計，當他們的網站載入時間每慢 1 秒， AMAZON 的損失就可能高達 16 億美元
3. 全站AMP網頁 透過Astra佈景主題+AMP 外掛 + Gutenberg編輯器 AMP相容佈景主題和外掛列表 https://amp-wp.org/ecosystem/
4. 伺服器端渲染(SSR) • AMP 會先隱藏網頁畫面，直到畫面布局計算完成，才顯示網頁畫面 • SSR可以再加快58%的網頁渲染速度 Load Time (s) Start Render (s) First Interactive (s) Original 5.435 4.591 5.367 AMP 4.591 -15.53% 4.566 -0.54% 5.094 -5.09% AMP + SSR 4.095 -24.66% 1.892 -58.79% 4.818 -10.23%
5. 免費 V.S. 付費 DNS
6. CDN TTFB (不使用 CDN) TTFB (使用 CDN)
7. NGINX + FASTCGI CACHE + PHP7 Nginx處理靜態內容(Static content) 的效能為APACHE的2倍 Fastcgi 快取讓PHP反應時間更快 PHP7.3速度是PHP5.6的三倍快
8. PHP 7.4 & 預載功能
9. 資料庫查詢快取 • REDIS CACHE可以暫存資料庫查詢結果，減少資料庫查詢浪費的時間 • REDIS有兩種： PHPREDIS(C語言撰寫) 和 PREDIS(用PHP撰寫) • 請用PHPREDIS， PHPREDIS的速度是PREDIS的6倍快
10. HTTP/2 V.S. HTTP/3 HTTP/1 HTTP/2
11. 減少建立HTTPS連線耗時 100ms 200ms 0-RTT (Zero Round Trip Time Handshake)
12. PHP-FPM WORKERS PHP-FPM Workers就像大賣場收銀員，收銀員越多結帳速度越快 *電子商務型網站，收銀員數量很重要
13. BROTLI文字檔案壓縮 Brotli比gzip壓縮再減少26%檔案大小 壓縮等級 比GZIP解壓縮速度 比GZIP壓縮檔案大小 Brotli (4) 快21% 小9%
14. PAGESPEED模組 • 優化傳輸頻寬（過濾）（壓縮圖片、CSS、JS文件，去除HTML空白）、降低請求（CSS、 JS文件合併、識別並重新定向常用JS庫、CACHE控制）、DOMAIN映射（支援CDN）、 提升客戶端體驗（圖片預載、延遲加載，圖像最佳化）… • 讓PAGESPEED模組來幫你幹這些網頁速度最佳化的粗活 • 為什麼不用WP SUPER CACHE 或 WP ROCKETS等速度最佳化外掛? 因為PHP慢…
15. 資料庫查詢最佳化 • 採用INNODB，不要用MYISAM Options 資料表Autoload欄位設定索引 前 後
16. 主從式資料庫架構 https://wordpress.org/plugins/hyperdb/ 需安裝HyperDB Plugin，讓WordPress支援主從式資料庫架構
17. PLUGINS 設定最佳化 • 使用程式寫得好的Plugins • 不要用來路不明的Plugins • Plugins正確設定 • 將Plugins移除乾淨 https://kinsta.com/best-wordpress-plugins/ 程式效能寫的較佳的推薦外掛
18. 卸載非必須檔案 非WooCommerce頁面，卸載WooCommerce相關的 CSS 和 JavaScript 檔案
19. 卸載WordPress累贅的功能 停用 RSS Feeds、移除 jQuery Migrate、移除 RSD連結、移除 wlwmanifest連結、移除檔案版本… 減少主機負載
20. 關閉WordPress排程工作(WP cron jobs) • WORDPRESS的排程工作在【每次網頁被瀏覽】的 時候，都會先去比對當前是否有排程工作要執行， 如果你安裝的PLUGIN偷偷幫你排程了甚麼執行很 久或含有大量資料庫查詢的排程工作，便會大量消 耗你的CUP、記憶體和佔據PHP WORKER ，增加你 主機的負擔。 • 改由”作業系統”來排程工作 • 安裝CORN 管理外掛來刪除不必要的排程工作
21. 找出速度瓶頸 NEW RELIC