- 產業
- 旅宿
- 年份
- 2024
- 技術
- 邊緣渲染 · 圖片管線 · 效能預算
0.8s
最大內容繪製
課題
訂房首屏 4.1 秒。載入動畫做得很漂亮,那本身就是問題的證據 —— 沒有人會為一個 0.8 秒的頁面設計載入動畫。
限制
行銷部門每週要上新的活動頁,而且要能自己上。任何一個「以後每頁都要工程師檢查效能」的方案,第三週就會失效。
做法
設效能預算並接進 CI,圖片管線重做,訂房主流程改在邊緣渲染。超出預算的 PR 直接擋下,訊息寫清楚是哪一項、超了多少。
一個關鍵決定
把預算檢查放在合併之前,不是上線之後的監控。上線後才看到的數字,修的人已經在做下一件事了;合併前擋下來,修它的還是剛剛寫它的那個人。
取捨
行銷有兩次的活動頁因為圖片太大被擋下來,素材要重做,那兩次都有人不高興。但六個月後沒有人再提這件事,因為素材規格已經變成他們自己的習慣。
結果
LCP 0.8 秒,載入動畫被刪掉。行動端轉換率上升 22%。
之後
十四個月過去,效能預算一次都沒有被調鬆過。這是我們最看重的一個數字,雖然它不在任何一份報表上。