Comparison
Long taskvsTotal blocking time
Long task
one function held the main thread for 300 milliseconds and every click during it queued up behind it.
Any task occupying the main thread for more than fifty milliseconds, during which the browser cannot respond to input or paint. It is the atomic unit of unresponsiveness: interaction latency is almost always a queue behind one of these. Breaking one up means yielding to the event loop between chunks, which is what `scheduler.yield` and the older `setTimeout` trick both do.
Full entry →Total blocking time
the lab report says two seconds of blocking time and you can see it as a wall of yellow in the profile.
The sum of the part of every long task that exceeds fifty milliseconds, between first contentful paint and interactivity. It is the lab stand-in for responsiveness, because a synthetic run has no real interactions to measure. Improving it and improving interaction to next paint usually mean the same work, which is why it is the number to watch in CI.
Full entry →