快取與 CDN:網站變快的兩大基礎建設

你有沒有發現,一個網站第一次打開有點慢,第二次卻幾乎是秒開?這不是錯覺,而是「快取」在背後工作。快取(cache)簡單說就是「把算過的答案先抄下來,下次直接翻答案,不用重算」。而 CDN(內容傳遞網路)則是把這些答案抄到離訪客最近的地方。這兩件事加起來,構成了網站速度的兩大基礎建設。

我們自己經營電商與 AI 工具平台,流量高峰時最先救命的不是加伺服器,而是把快取層設計好。這篇用白話把瀏覽器快取、伺服器快取與 CDN 的分工講清楚,讓你就算不寫程式,也能跟工程團隊對上話。

瀏覽器快取:訪客自己的抽屜

當你第一次造訪一個網站,瀏覽器會把圖片、字型、CSS、JavaScript 這些「不常變動的檔案」存在你的電腦或手機裡。第二次造訪時,瀏覽器發現抽屜裡已經有了,就直接拿出來用,連網路請求都省了。這就是為什麼第二次開比較快。

關鍵在於「存多久」。伺服器透過 HTTP 標頭告訴瀏覽器每個檔案可以快取多久:Logo 和字型可能設一年,商品圖設幾天,而網頁本身通常不快取或只快取很短時間——因為價格、庫存隨時在變。

這裡有個常見的坑:檔案更新了,但訪客的瀏覽器還抱著舊版不放。業界的標準解法是在檔名裡加版本指紋(例如 app.a1b2c3.css),檔案一改,檔名就變,瀏覽器自然會抓新的。如果你改版後客人回報「畫面怪怪的、按 Ctrl+F5 才正常」,八成就是快取版本策略沒做好。

伺服器快取:別讓資料庫重算同一題

訪客每開一個頁面,伺服器可能要查好幾次資料庫、跑一輪商業邏輯才能組出 HTML。如果一千個人看同一個商品頁,伺服器真的需要算一千次嗎?當然不用。伺服器快取就是把算好的結果暫存起來——可能是整頁 HTML,也可能是某段查詢結果——在有效期間內直接回覆,資料庫壓力瞬間降一個量級。

但伺服器快取有一條鐵律:會員專屬、購物車、訂單這類個人化內容絕對不能整頁快取。我們看過最慘的事故型態,就是 A 客人打開網站看到 B 客人的購物車——這不是速度問題,是資安事故。所以實務上通常是「公開頁面積極快取、個人化區塊另外用 API 載入」的混合策略。

快取的本質是一場交易:用「資料可能舊幾分鐘」換「速度快十倍」。設計快取,其實是在設計你能容忍多舊的資料。

CDN:把檔案搬到訪客家巷口

CDN(Content Delivery Network)是分布在全球各地的伺服器網路。你的主機可能在台北,但透過 CDN,東京、新加坡、洛杉磯的訪客都能從離自己最近的節點拿到網站檔案,物理距離縮短,速度自然快。對台灣為主的網站,CDN 還有兩個常被忽略的價值:一是幫你的主機擋掉大部分靜態檔案流量,主機頻寬與費用都省;二是多數 CDN 內建基本的攻擊防護,對抗惡意流量多一層盾。

Cloudflare 有免費方案,對中小型網站來說幾乎是無腦必裝。但要提醒一個我們實際踩過的坑:CDN 連「錯誤的回應」也可能快取。如果某個檔案在主機上一度是 404,CDN 可能把這個 404 記住,即使主機端已經修好,訪客拿到的還是快取裡的錯誤版本。所以每次部署或修復後,記得清除(purge)CDN 快取,這應該寫進上線的標準流程。

三層怎麼分工?一個實用的檢查順序

• 靜態資源(圖、字型、CSS、JS):瀏覽器快取設長效期 + 檔名帶版本指紋 + 走 CDN。
• 公開頁面(首頁、文章、商品頁):伺服器快取或預先產生靜態頁,效期依內容更新頻率設定。
• 個人化內容(購物車、會員頁):不整頁快取,必要時只快取其中不含個資的片段。
• 部署流程:每次上線後清 CDN 快取,並實際用無痕視窗驗證新版有生效。

速度不是玄學,是基礎建設的堆疊。如果你的網站被客人抱怨慢,先別急著換主機——快取與 CDN 這兩層通常能用最小成本換到最大改善。想知道效能指標怎麼解讀,可以接著看Core Web Vitals 白話解讀;如果想從架構層面把網站體質做好,歡迎了解我們的品牌官網設計開發服務,快取策略從第一天就會設計進去。