★ 以淺顯易懂的圖文說明如何改善效能、可重現問題和動手操作的範例程式碼，便於學習與演練。
★ 以使用者的角度解釋效能、改善效能，不再讓優化效能這件事霧裡看花、改了卻沒感受到任何效果。
★ 以實際的網站說明如何改善效能，便於評估自身產品的優化成本。

目標讀者：
✔想要優化網站效能，卻不知從何著手的前端工程師。
✔ 已具備優化網站效能知識與技能，卻不知如何從使用者的觀點改善效能的前端工程師。
✔ 想要了解前端工程師如何優化網站效能、學習基本概念與技術的非前端工程師。
✔ 想要評估優化網站的成本、參考業界範例的管理者。

作者簡介

唐心皓（Summer）

現為趨勢科技的資深工程師，熱愛前端技術，是知名部落格「Summer。桑莫。夏天」的作者。致力於技術的傳播，相信分享能打破知識的隔閡，讓不同領域的人們都能有所連結。

• Facebook: www.facebook.com/cythilya
• Twitter: @cythilya
• Email: cythilya@gmail.com
• 歡迎至部落格留言 cythilya.github.io

02 RAIL
03 網站指標（Web Vitals）
04 工具
05 首次顯示內容（First Contentful Paint）
06 最大內容繪製（Largest Contentful Paint）
07 互動準備時間（Time to Interactive）
08 總阻塞時間（Total Blocking Time）
09 首次輸入延遲（First Input Delay）
10 速度指數（Speed Index）
11 累計版位配置位移（Cumulative Layout Shift）
12 搜尋引擎優化（SEO）與網站指標
13 案例研討：趨勢科技（Trend Micro）Deep Discovery Director
14 案例研討：Mixtini
15 案例研討：露天拍賣 － 手機版網站商品頁問與答
16 未來方向與總結
附錄A 中英文名詞索引