要實作前端效能測試（Performance Testing）前，需要先知道什麼是「前端效能」？ 網頁前端效能關注的是「使用者在瀏覽器上使用網站所感受到的網站加載速度、請求/反應時間及整個使用者體驗」。效能的好與壞會很直接的影響用戶的去留。 Google 提出的 Core Web Vitals 即是衡量前端網站效能的一個方式。可以這些指標作為測試網頁前端效能的標準。

LCP（Largest Contentful Paint）

LCP 是指「網站內容中『最大可見元素』的加載時間」。其關注的是加載速度（loading time）。
Google 設定的標準是 LCP < 2.5s 才是好的用戶體驗。

FID（First Input Display）

FID 是指「進入網站後的第一個互動（ex.點擊、下拉選單等）的延遲時間。其關注的是互動性（Interactivity）。
Google 設定的標準是 FID < 0.1s 才是好的用戶體驗。

CLS（Cumulative Layout Shift）

CLS 是指「網站累計版面配置的轉移」，其計算公式是移動範圍所佔比例 * 影響範圍所佔比例。其關注的是視覺穩定性（Visual Stability)。
Google 設定的標準是 CLS < 0.1s 才是好的用戶體驗。

INP（Interaction to Next Paint）

Google 於 2023.05 提出的新指標，預計將於 2024.03 取代 FID，成為 Google Web Vitals 的新指標之一。鑑於 FID 僅取得「第一次互動的延遲時間」作為判斷，似乎無法衡量到整個網站的互動延遲時間。因此 INP 要衡量的是網站中的所有互動的輸入延遲、處理延遲、顯示延遲，亦即計算延遲時間至「下一個畫面顯示為止」。

總結

理解了網站效能的衡量標準後，便可以針對這些指標做測試。