Documentation for the performance metrics returned by DevTools protocol Performance.getMetrics

[michael beeri]

I'm using puppeteer's page.metrics() which calls the DevTools protocol Performance.getMetrics() 

Here is a sample of the returned data :

{
   Timestamp: 672.244221,
   Documents: 3,
   Frames: 2,
   JSEventListeners: 2,
   Nodes: 4116,
   LayoutCount: 3,
   RecalcStyleCount: 2,
   LayoutDuration: 0.136179,
   RecalcStyleDuration: 0.027681,
   ScriptDuration: 0.188817,
   TaskDuration: 0.563811,
   JSHeapUsedSize: 2959520,
   JSHeapTotalSize: 5132288
}

The only documentation i could find for these numbers is in puppeteer's documentation

and it is basically this:

• Timestamp <number> The timestamp when the metrics sample was taken.
• Documents <number> Number of documents in the page.
• Frames <number> Number of frames in the page.
• JSEventListeners <number> Number of events in the page.
• Nodes <number> Number of DOM nodes in the page.
• LayoutCount <number> Total number of full or partial page layout.
• RecalcStyleCount <number> Total number of page style recalculations.
• LayoutDuration <number> Combined durations of all page layouts.
• RecalcStyleDuration <number> Combined duration of all page style recalculations.
• ScriptDuration <number> Combined duration of JavaScript execution.
• TaskDuration <number> Combined duration of all tasks performed by the browser.
• JSHeapUsedSize <number> Used JavaScript heap size.
• JSHeapTotalSize <number> Total JavaScript heap size.

I would really like to get a more details regarding these numbers, and specifically to answer these questions:

1. TaskDuration is not the sum of ScriptDuration, LayoutDuration and RecalculateStyleDuration,
Where was the rest of the time wasted ?,
what other measurements i can take to account for that missing time ?

2. What are documents and frames ?