231 reads

Javascript Methods from Performance Timeline API

by Mozilla ContributorsJune 1st, 2020

Too Long; Didn't Read

Performance Timeline API defines extensions to the Performance interface to support client-side latency measurements within applications. Extensions provide interfaces to retrieve performance entry metrics based on specific filter criteria. The standard also includes interfaces that allow an application to define performance observer callbacks that are notified when specific performance events are added to the browser's performance timeline. The PerformanceEntry interface encapsulates a single performance entry — that is, a single data point or metric in the performance timeline. This document provides an overview of the standard's interfaces.

Company Mentioned

featured image - Javascript Methods from Performance Timeline API

The Performance Timeline API defines extensions to the

Performance

interface to support client-side latency measurements within applications. The extensions provide interfaces to retrieve performance entry metrics based on specific filter criteria. The standard also includes interfaces that allow an application to define performance observer callbacks that are notified when specific performance events are added to the browser's performance timeline.

This document provides an overview of the standard's interfaces. For
more details about the interfaces, see the reference pages and Using Performance Timeline.

Performance extensions

The Performance Timeline API extends the

Performance

interface with three methods that provide different mechanisms to get a set of

performance records (metrics)

, depending on the specified filter criteria. The methods are:

getEntries()

Returns all recorded

performance entries

or, optionally, the entries based on the specified

name

performance type

and/or the

initiatorType

(such as an HTML element).

getEntriesByName()

Returns the recorded

performance entries

based on the specified name and optionally the

performance type

getEntriesByType()

Returns the recorded

performance entries

based on the specified

performance type

PerformanceEntry interface

The

PerformanceEntry

interface encapsulates a single performance entry — that is, a single data point or metric in the performance timeline. This interface has the following four properties, and these properties are extended (with additional constraints) by other interfaces (such as

PerformanceMark

name

The name of the performance entry when the metric was created.

entryType

The type of performance metric (for example, "

mark

").

startTime

high resolution timestamp

representing the starting time for the performance entry.

duration

A high resolution timestamp representing the time value of the duration of the performance event. (Some performance entry types have no concept of duration and this value is set to '

' for such types.)

This interface includes a

toJSON()

method that returns the serialization of the

PerformanceEntry

object. The serialization is specific to the performance entry's

type

Performance observers

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The performance observer interfaces allow an application to register an observer for specific performance event types, and when one of those event types is recorded, the application is notified of the event via the observer's callback function that was specified when the observer was created.

When the observer (callback) is invoked, the callback's parameters include a

performance observer entry list

that contains only observed

performance entries

. That is, the list contains entries only for the event types that were specified when the observer's

observe()

method was invoked. The

performance observer entry list

interface has the same three getEntries*() methods as the

Performance

interface. However, note there is one key difference with these methods; the

performance observer entry list

versions are used to retrieve observed performance entries within the observer callback.

Besides the

PerformanceObserver's

interface's

observe()

method (which is used to register the

entry types

to observe), the

PerformanceObserver

interface also has a

disconnect()

method that stops an observer from receiving further events.

Performance observers were added to the Level 2 version of the standard and were not widely implemented.

Implementation status

A summary of the interfaces' implementation status is provided below, including a link to more detailed information.

Performance interface extensions: As shown in the
```
Performance
```
interface's Browser Compatibility table, most of these interfaces are broadly implemented by desktop browsers and have less support on mobile devices.
PerformanceEntry: As shown in the
```
PerformanceEntry
```
interface's Browser Compatibility table, most of these interfaces are broadly implemented by desktop browsers and have less support on mobile devices.
Performance Observers : As shown in the
```
PerformanceObserver
```
interface's Browser Compatibility table, this interface has no shipping implementations.

To test your browser's support for these interfaces, run the