如何测量首漆（FP）？

Question

PageSpeed Insights 和 Lighthouse 能够衡量 First Contentful Paint (FCP)、First Meaningful Paint (FMP) 和其他指标，但我如何衡量 First Paint (FP)？

Answer 1

您可以在 Chrome DevTools -> Performance 中以与 Largest Contentful Paint (LCP) 相同的方式测量 First Paint (FB)。

您可以在 Chrome DevTools documentation 中查看更多信息。

Answer 2

您可以通过以下两种性能方法来衡量 First-Paint(FP) API。

1. 使用 getEntriesByType - 下面的代码片段：

   const {name, startTime} = performance.getEntriesByType('paint')[0];
   console.log(Metric Name: ${name}, StartTime: ${startTime});

2. 使用 getEntriesByName - 下面的代码片段：

   const {name, startTime} = performance.getEntriesByName('first-paint')[0];
   console.log(Metric Name: ${name}, StartTime: ${startTime});