Calculating Front end performance metrics via Web API's ( navigation API and performance timeline API)

user_14315176 0
Viewed 137

In order to calculate the first contentful paint , i used the below command in my browser console.

window.performance.getEntriesByType('paint') -> From that , i fetched the start time of first contentful paint which is : startTime: 710.1449999972829 ms.

Reference

But if i audit the same page via lighthouse(from chrome dev tools), the first contentful paint calculated by lighthouse is '1.5 s'

I am trying to understand why there is a wide difference between the two data. Tried running the audit couple of times via lighthouse, still the data hardy matches with web api data.

Can anyone explain me as to why there is huge difference. Should i go ahead with the data from web api's or should i consider lighthouse data as valid one?

webapi lighthouse performance-testing testing automation
1 Answers

Thank you for the great question, I learned something today because of it.

It appears that even on desktop view there is some throttling applied to the CPU, this didn't used to be the case as far as I am aware.

I found this article that explains the current throttling policy.

The key part here is as follows:

Starting with Chrome 80, the Audits panel is simplifying the throttling configuration:

  1. Simulated throttling remains the default setting. This matches the setup of PageSpeed Insights and the Lighthouse CLI default, so this provides cross-tool consistency.
  2. No throttling is removed as it leads to inaccurate scoring and misleading metric results.
  3. Within the Audits panel settings, you can uncheck the Simulated throttling checkbox to use Applied throttling. For the moment, we are keeping this Applied throttling option available for users of the View Trace button. Under applied throttling, the trace matches the metrics values, whereas under Simulated things do not currently match up.

Point 3 is the main part. Basically the throttling is still applied to the CPU on desktop. Also note they say "for the moment" so this is obviously something they are considering removing in the future.

This is actually a really good idea, most developers are running powerful hardware, most consumers are running cheap off the shelf laptops with i3 processors (or equivalent...or worse!).

As Google spend a lot of time refining Lighthouse I would leave Simulated throttling ON and use their results as they will be more indicative of what an end user might see.

Switching off simulated throttling

If you want your trace results (or console performance API results) to match then uncheck "simulated throttling" at the top of the page.

user_27028940
Related