你有沒有點開一個網站，等了幾秒還是白畫面，就直接按上一頁？你的客人也一樣。網站慢，流失的不只是體驗，還有詢問與訂單。
先量測，再動手
到 PageSpeed Insights 輸入網址，切到「行動裝置」。除了總分，更值得看的是 Google 的三項核心網頁指標：
| 指標 | 量的是什麼 | 良好標準 |
|---|---|---|
| LCP 最大內容繪製 | 主要內容多久出現 | 2.5 秒以內 |
| INP 與下一個畫面的互動 | 按下按鈕後多快有反應 | 200 毫秒以內 |
| CLS 累計版面配置位移 | 畫面會不會載入時跳動 | 0.1 以下 |
報告下方會列出建議，通常都落在下面四個原因。
一、圖片太大
這是最常見、也最容易改善的。一張直接從相機上傳的照片可能有好幾 MB，手機要下載很久。
- 改用 WebP 等新一代格式，檔案通常小很多，畫質幾乎看不出差別。
- 依照實際顯示尺寸輸出，不要把 4000 像素的圖片縮成 400 像素顯示。
- 第一屏以下的圖片延遲載入，滑到才下載。
二、沒有快取
WordPress 每次有人開網頁，都要即時組出整頁內容。加上快取，就是把做好的頁面先存起來，下一位訪客直接拿現成的。
- 頁面快取：把整頁存成靜態檔案。
- CDN：把檔案放到離訪客最近的節點，例如 Cloudflare。
- 瀏覽器快取：圖片、字型這類不常變的檔案，讓瀏覽器記住，下次不用重新下載。
三、字型載入方式
中文字型檔很大，載入方式不對，文字會等很久才出現。
- 只載入真的有用到的字重，不要四五種粗細全部載入。
- 使用分割載入的網路字型服務，只下載頁面用到的字。
- 設定先用系統字顯示，字型下載完再替換，不讓文字空白。
四、第三方程式碼太多
聊天視窗、追蹤碼、社群嵌入、影片、廣告像素……每一個都要額外下載程式，加起來常常比網站本身還重。
- 盤點裝了哪些，不再使用的移除。
- 非必要的程式延後到頁面載入完成後再執行。
- 影片先顯示縮圖，點擊才載入播放器。
小提醒：主機也是速度的基礎。共用主機資源有限，流量一多就變慢；選擇合適等級的主機，前面的優化才能發揮作用。
速度優化不是一次性的工作，新增內容與外掛都可能讓網站變慢。我們在交付網站時會做完這四項設定，維運期間也會定期檢查分數。