網站慢的常見原因與優先處理順序

先處理影響最大的，不要從難的開始

效能優化最常見的錯誤，是一頭栽進技術細節，卻沒發現首頁有一張 8MB 的圖。

以下依影響程度與處理難度排序，多數網站處理完前三項就會有明顯改善。

第一優先：圖片

這是最大宗，而且處理起來最容易。

典型狀況是：同仁直接把手機拍的原圖上傳，一張好幾 MB。一頁十張就是幾十 MB，在行動網路下等同打不開。

處理方式

• 調整到實際顯示需要的尺寸
• 適度壓縮
• 畫面外的圖片延遲載入
• 事先指定顯示尺寸，避免載入時版面跳動

更根本的做法是讓後台自動處理——上傳時就縮圖、壓縮。否則問題會反覆發生，因為沒有人會記得每次都手動處理。

詳細作法見圖片尺寸與壓縮。

第二優先：首頁塞太多東西

首頁是最多人看、也最容易失控的頁面。常見的累積：

• 輪播圖放了八張，每一張都要載入
• 滿版背景影片沒有壓縮，手機也照播
• 嵌入了地圖、社群動態牆、影音播放器、客服視窗
• 各種行銷追蹤碼疊加

處理方式

• 輪播圖減到三張以內——實際上多數訪客不會看到第三張以後
• 背景影片壓縮，且手機版改用靜態圖
• 嵌入的第三方內容改為捲動到該區才載入
• 盤點追蹤碼，移除已經不用的

這一項的效益通常僅次於圖片，而且不需要動到程式。

第三優先：字型

容易被忽略的隱形負擔。整套中文字型可能達數 MB，比許多圖片還大。

處理方式

• 整站字型控制在兩種以內
• 只載入實際用到的字重（粗體、細體各算一份）
• 標題用特殊字體、內文用系統字體，是兼顧特色與速度的常見做法
• 設定成字型載入前先用系統字體顯示，避免文字空白一段時間

第四優先：外掛與第三方服務

每一個外掛、每一段追蹤碼，都會增加載入負擔與可能的阻塞。

處理方式

• 盤點目前安裝了什麼——很多網站有裝了但早就不用的功能
• 移除重複功能的外掛
• 追蹤碼改為延後載入
• 客服視窗、聊天工具改為使用者互動後才載入

這一項在維護中的網站特別值得定期檢視，因為外掛通常只增不減。

第五優先：主機與伺服器回應

如果上述都處理了還是慢，或是連純文字頁面都要等很久，那問題可能在伺服器端。

判斷方式：測速工具通常會顯示「伺服器回應時間」這類指標。如果這個數值就已經偏高，前端怎麼優化都有限。

詳見主機規格與速度的關係。

第六優先：程式與資料庫

屬於較深層的問題，通常出現在功能較複雜的網站：

• 資料庫查詢沒有建立適當索引，資料量大時明顯變慢
• 一個頁面重複執行大量查詢
• 沒有使用快取，每次都重新運算相同的結果

這一層需要開發人員處理，見快取是什麼。

怎麼判斷自己屬於哪一種

幾個快速的判斷：

手機專屬的問題見手機版破版與常見問題排查。

一個務實的提醒

處理完前三項後再測一次。多數企業網站到這裡就已經足夠了。

後面的項目投入成本較高、改善幅度較小。除非網站流量大或有明確的效能需求，否則把力氣放在內容經營上，投報率通常更高。