先把結論放在最前面：如果你的商品頁在手機上要跑超過三秒，先別急著加碼廣告，因為你正在把已經花錢買到的流量原地放掉。我每天在 ECPRO 的資料庫裡翻台灣電商站的技術棧與流量輪廓，速度差的站有一個非常一致的長相——廣告有在投、訪客有進來，但停留短、跳出高、轉換率長期低於同品類的中位數。速度不是工程部門的家務事，它是一個直接寫在損益表上的營運變數。
這篇文章我想用數據媒體的視角把這件事講透：慢的網站到底在哪兩個地方漏錢、Google 拿來衡量體驗的三個核心指標各自在量什麼、動手優化時先做哪件事投報率最高，最後給一套我自己在用的量測與健檢節奏。看完你應該能自己排出一張優化順位表，而不是被工程報價單牽著走。
我在資料庫裡看到的共同病徵
ECPRO 長期掃描台灣上萬個網站的技術組成，有一類站的樣貌重複出現的頻率高到讓我印象深刻：頁面上掛了十幾支第三方腳本、首圖是幾 MB 的原始大圖、主機回應慢吞吞，然後品牌端的困惑永遠是同一句——「廣告成效怎麼越投越差」。
把這類站的流量輪廓攤開看，問題其實不在廣告。訪客確實被帶進來了，但頁面還在轉圈圈的那幾秒裡，人就走了。這種站的體質數據通常呈現三個特徵：
- 行動端表現遠差於桌機，而台灣電商的行動流量占比通常是大宗，等於主戰場先輸；
- 入站即離的比例偏高，訪客連第一個畫面都沒等到就關掉分頁；
- 技術棧越堆越厚，行銷工具、客服外掛、彈窗套件層層疊上去，沒有人負責定期清理。
我的觀察是，多數品牌不是不知道網站慢，而是不知道慢到什麼程度、慢在哪裡、先修哪裡。這正是接下來要拆的東西。
慢一秒，錢從兩個口袋一起漏
網站慢造成的損失是雙軌的，很多人只算到第一軌。
第一軌是付費流量的直接浪費。你為每一次點擊付了錢，訪客卻在載入的等待中離開，這筆媒體費等於直接蒸發，而且離開的人幾乎不會主動回來。載入時間和放棄率之間是一條很陡的曲線，從業界長期的共識來看，頁面拖過三秒之後，願意繼續等的人會大幅減少，行動網路環境不穩時掉得更兇。
第二軌比較隱性，是自然搜尋的長期失血。Google 已把頁面體驗指標納入排名訊號，當大量訪客一進站就跳走，搜尋引擎會把它讀成「這個結果沒有滿足使用者」。內容品質仍然是排名的主角，但在競爭激烈的電商關鍵字上，兩個內容水準相近的頁面，體驗好的那個就是會站得比較前面。也就是說，慢的網站一邊燒廣告費、一邊把免費流量讓給對手，兩頭課稅。
把這兩軌加起來，你就懂為什麼我一直說速度該和選品、定價放在同一張營運檢討表上，而不是丟給工程師的待辦清單。
LCP、CLS、INP：Google 到底在量什麼
Google 把「體驗好不好」量化成三個核心網頁指標（Core Web Vitals），分別對應載入、穩定、反應三個面向。搞懂每個指標量的是什麼，你才有辦法對症下藥，而不是籠統地喊「網站要變快」。
LCP：主要內容多久出現
LCP（Largest Contentful Paint）量的是頁面上最大一塊主內容完成呈現的時間。對電商來說，那塊通常是商品主圖或首屏視覺。訪客心裡「頁面好了沒」的體感，大致就是 LCP 在描述的東西。拖慢 LCP 的三大常犯：未壓縮的大圖、擋在前面的阻塞式程式碼、回應遲鈍的主機。
CLS：版面會不會亂跳
CLS（Cumulative Layout Shift）量的是載入過程中版面位移的累積程度。你一定遇過：正要按下購買鍵，上方突然擠進一張橫幅，按鈕被推走、手指點到別的東西。造成 CLS 的常見來源是圖片沒有預留寬高、延遲載入的廣告版位把內容撐開、字型替換造成文字跳動。在結帳流程裡，版面亂跳不只惱人，還會直接製造誤觸與棄單。
INP：點下去多久有反應
INP（Interaction to Next Paint）是三者中較新的指標，取代了早期的 FID，量的是使用者互動之後頁面給出視覺回應的延遲。切規格、開選單、加入購物車，每一次互動都被記錄。INP 差幾乎都指向同一個病灶：過重的 JavaScript 把瀏覽器的主執行緒塞住了，使用者點了，瀏覽器卻在忙別的。
三個指標的達標門檻整理如下：
| 指標 | 面向 | 良好 | 不合格 |
|---|---|---|---|
| LCP | 載入速度 | 2.5 秒以內 | 超過 4 秒 |
| CLS | 視覺穩定 | 0.1 以下 | 超過 0.25 |
| INP | 互動反應 | 200 毫秒以內 | 超過 500 毫秒 |
提醒一件事：看數據時請以行動端為準。手機的網路與運算條件都比桌機差，數字幾乎一定比較難看，而那裡才是台灣電商的主要成交場景。
優化順位一：先動圖片，這是多數站的最大負重
如果只能先做一件事，答案幾乎沒有懸念——處理圖片。電商頁面的傳輸重量通常有一半以上來自圖片，商品圖、情境照、活動橫幅疊起來動輒數 MB，這是 LCP 與 CLS 的共同源頭，也是投報率最高的下手處。
- 換格式：把 JPG、PNG 轉成 WebP 或 AVIF，畫質幾乎無感，體積通常能砍掉一半以上，是壓低 LCP 最直接的一步。
- 給對尺寸：用 srcset 讓手機載入手機尺寸的圖。讓小螢幕吞兩千多像素的桌機大圖，是我在資料庫裡最常看到的浪費。
- 首屏之外延遲載入：畫面外的圖等使用者捲到再載，把首屏的頻寬留給最關鍵的內容。
- 預留寬高：每張圖都標明寬高或長寬比，圖片載入時版面就不會被撐開，這是治 CLS 的根本。
- 上架前先壓縮：建立「原圖不落地」的上稿習慣，任何圖片進站前都先過一輪壓縮流程。
依我的經驗，光是「全站轉 WebP＋補齊寬高」這兩個動作，就足以讓很多站的 LCP 和 CLS 同步跨進良好區間，成本卻遠低於改版或搬家。
優化順位二：把第三方腳本從主執行緒上請下來
圖片之後，第二關是程式碼，重點是 JavaScript 的量與載入時機，這一層主要影響 INP 和 LCP。
台灣電商站有個很普遍的現象：行銷團隊每接一個工具就往網站塞一段代碼——分析、再行銷、客服、聊天機器人、彈窗、A/B 測試，日積月累疊成厚厚一層。每支腳本單看都不重，加總起來卻讓瀏覽器忙到沒空理會使用者的點擊。可以動手的方向：
- 盤點全站掛載的第三方腳本，找出已停用的服務與重複的追蹤碼，直接移除；
- 不影響首屏的腳本一律延後執行（defer 或 async），別讓它們卡在渲染路徑上；
- CSS 與 JavaScript 做最小化與壓縮傳輸，減少下載體積；
- 靜態資源設定瀏覽器快取，讓回訪客第二次進站時明顯變快；
- 把靜態資源放上 CDN，讓各地訪客就近取檔，對客群分散的品牌特別有感。
這類盤點工作很瑣碎，但它應該被制度化成季度例行公事，而不是等網站慢到被客訴才做一次大掃除。工具會一直加，清理也要一直做。
一個匿名案例：行動轉換率長期墊底的站怎麼救回來
講一個我追蹤過的案例，細節做了去識別化處理。一個賣生活雜貨的品牌官網，廣告預算不小、進站流量穩定，但行動端轉換率長期只有桌機的一半左右，團隊一度以為是受眾投錯。
把技術面攤開檢查，病因很典型：首屏主圖是未壓縮的原始檔，行動端 LCP 遠超過合格線；頁面掛了十多支第三方腳本，其中好幾支來自早已停用的行銷工具；活動橫幅採延遲載入卻沒預留高度，訪客捲動到一半版面就跳一下。
處理的順序完全照本文的順位走：先把全站圖片轉成新格式並依裝置出圖、補齊所有圖片的寬高屬性，再把停用工具的代碼清掉、把非必要腳本延後，最後為靜態資源加上快取與 CDN。整個過程沒有改版、沒有換平台，大約一個多月的節奏做完。結果是行動端的體驗指標全數回到良好區間，行動轉換率與桌機的差距明顯收斂——注意，這段期間廣告設定完全沒動。省下來的不是新預算，是原本每天都在流失的那群人。
這個案例我最想強調的一點：他們缺的從來不是更多流量，而是把既有流量接住的地板。地板補好之前，加碼廣告只是把水倒進破桶。
量測工具怎麼搭、健檢節奏怎麼抓
優化之前一定先量測，否則你不知道問題在哪，也無法證明改了有效。工具不用多，四個免費的就夠，重點是各自的角色：
- PageSpeed Insights：輸入網址就拿到行動與桌機的指標數值和具體改善清單，是第一站；
- Search Console 的核心網頁指標報表：看的是真實使用者的實地數據，能列出全站哪些網址被歸為需改善，適合抓整站的問題分布；
- Lighthouse：內建在 Chrome 開發者工具，工程師改一版測一版的貼身工具；
- WebPageTest：能模擬不同地區與網速，還有細到毫秒的載入瀑布圖，適合深挖單頁瓶頸。
節奏上我建議這樣排：先用 Search Console 圈出不合格的網址群，再用 PageSpeed Insights 對流量與營收貢獻最大的幾個頁面逐一體檢，火力集中在首頁、主力商品頁與結帳流程，不要一開始就妄想全站翻修。修完之後把「每月看一次核心指標報表」排進例行工作，因為每一次上新工具、換版型、加活動版位，都可能把指標重新弄壞。速度優化不是一次性專案，是持續性的體質管理。
結語：把速度當成營運指標來管理
整理一下這篇的骨架。網站速度同時決定你付費流量的接住率與自然搜尋的競爭力，是少數一次影響兩條流量管線的變數。診斷靠三個指標：LCP 看載入、CLS 看穩定、INP 看反應，一律以行動端數據為準。動手的順位很明確：圖片是最大負重，先換格式、給對尺寸、補寬高；再來清理第三方腳本、延後非必要程式，最後補上快取與 CDN。所有動作都建立在量測之上，用免費工具圈出最值錢的頁面優先處理。
從我天天看數據的位置回頭看，速度快的站不一定賣得好，但速度慢的站幾乎注定在每一個環節多付一層隱形成本。把速度納入你的月度營運指標，跟轉換率、客單價放在同一張表上盯，這件事的投報率，往往比下一波廣告加碼高得多。