Long Tasks API

Motivation

The experimental Long Tasks API gives us visibility into tasks that take 50 milliseconds or more. The 50 ms threshold comes from the RAIL Model, in particular the "Response: process events in under 50 ms" section.

Tasks that block the main thread for 50 ms or more cause, among other issues:

  • Delayed "Time to interactive".
  • High/variable input latency.
  • High/variable event handling latency.
  • Janky animations and scrolling.

Concepts

Some key terms or ideas that are utilized by the Long Tasks API.

Long task

Any uninterrupted period where the main UI thread is busy for 50 ms or longer. Common examples include:

  • Long running event handlers.
  • Expensive reflows and other re-renders.
  • Work the browser does between different turns of the event loop that exceeds 50 ms.

Culprit browsing context container

The "culprit browsing context container", or "the container" for short, is the top level page, iframe, embed or object that the task occurred within.

Attributions

A list of containers that the task occurred within. For tasks that don't occur within the top level page, the containerId, containerName and containerSrc fields may provide information as to the source of the task.

Usage

var observer = new PerformanceObserver(function(list) {
    var perfEntries = list.getEntries();
    for (var i = 0; i < perfEntries.length; i++) {
        // Process long task notifications:
        // report back for analytics and monitoring
        // ...
    }
});
// register observer for long task notifications
observer.observe({entryTypes: ["longtask"]});
// Long script execution after this will result in queueing
// and receiving "longtask" entries in the observer.

Interfaces

PerformanceLongTaskTiming
Reports instances of long tasks.
TaskAttributionTiming
Returns information about the work involved in a long task and its associate frame context.

Specifications

Specification Status Comment
Long Tasks API 1 Working Draft Initial definition.

Browser compatibility

PerformanceLongTaskTiming

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
PerformanceLongTaskTiming
Experimental
Chrome Full support 58Edge ? Firefox No support No
Notes
No support No
Notes
Notes See bug 1348405.
IE ? Opera Full support YesSafari ? WebView Android Full support 58Chrome Android Full support 58Firefox Android No support No
Notes
No support No
Notes
Notes See bug 1348405.
Opera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes
attribution
Experimental
Chrome Full support 58Edge ? Firefox No support NoIE ? Opera Full support YesSafari ? WebView Android Full support 58Chrome Android Full support 58Firefox Android No support NoOpera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
See implementation notes.
See implementation notes.

TaskAttributionTiming

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
TaskAttributionTiming
Experimental
Chrome Full support 58Edge ? Firefox No support No
Notes
No support No
Notes
Notes See bug 1348405.
IE ? Opera Full support YesSafari ? WebView Android Full support 58Chrome Android Full support 58Firefox Android No support No
Notes
No support No
Notes
Notes See bug 1348405.
Opera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes
containerId
Experimental
Chrome Full support 58Edge ? Firefox No support NoIE ? Opera Full support YesSafari ? WebView Android Full support 58Chrome Android Full support 58Firefox Android No support NoOpera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes
containerName
Experimental
Chrome Full support 58Edge ? Firefox No support NoIE ? Opera Full support YesSafari ? WebView Android Full support 58Chrome Android Full support 58Firefox Android No support NoOpera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes
containerSrc
Experimental
Chrome Full support 58Edge ? Firefox No support NoIE ? Opera Full support YesSafari ? WebView Android Full support 58Chrome Android Full support 58Firefox Android No support NoOpera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes
containerType
Experimental
Chrome Full support 58Edge ? Firefox No support NoIE ? Opera Full support YesSafari ? WebView Android Full support 58Chrome Android Full support 58Firefox Android No support NoOpera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
See implementation notes.
See implementation notes.

See also