PerformanceResourceTiming: initiatorType property
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2017.
Note: This feature is available in Web Workers.
The initiatorType
read-only property is a string representing web platform feature that initiated the resource load.
Note:
This property does not represent the type of content fetched. A .css
file can be fetched using a <link>
element leading to an initiatorType
of link
. When loading images using background: url()
in a CSS file, the initiatorType
will be css
and not img
.
Value
The initiatorType
property can have the following values, or other
if none of the conditions match.
audio
-
If the request was initiated by an
<audio>
element'ssrc
attribute. beacon
-
If the request was initiated by a
navigator.sendBeacon()
method. body
-
If the request was initiated by a
<body>
element'sbackground
attribute. css
-
If the request was initiated by a CSS
url()
function. early-hint
-
If the request was initiated by an
103
Early Hint
response. embed
-
If the request was initiated by an
<embed>
element'ssrc
attribute. fetch
-
If the request was initiated by a
fetch()
method. frame
-
If the request was initiated by loading a
<frame>
element. iframe
-
If the request was initiated by an
<iframe>
element'ssrc
attribute. icon
Non-standard-
If the request was initiated by a favicon. Non-standard and only reported by Safari.
image
-
If the request was initiated by an
<image>
element. img
-
If the request was initiated by an
<img>
element'ssrc
orsrcset
attribute. input
-
If the request was initiated by an
<input>
element of typeimage
. link
-
If the request was initiated by a
<link>
element. -
If the request was initiated by a navigation request.
object
-
If the request was initiated by an
<object>
element. ping
-
If the request was initiated by an
<a>
element'sping
. script
-
If the request was initiated by a
<script>
element. track
-
If the request was initiated by a
<track>
element'ssrc
. video
-
If the request was initiated by a
<video>
element'sposter
orsrc
. xmlhttprequest
-
If the request was initiated by an
XMLHttpRequest
.
Examples
Filtering resources
The initiatorType
property can be used to get specific resource timing entries only. For example, only those that were initiated by <script>
elements.
Example using a PerformanceObserver
, which notifies of new resource
performance entries as they are recorded in the browser's performance timeline. Use the buffered
option to access entries from before the observer creation.
const observer = new PerformanceObserver((list) => {
const scripts = list.getEntries().filter((entry) => {
return entry.initiatorType === "script";
});
console.log(scripts);
});
observer.observe({ type: "resource", buffered: true });
Example using Performance.getEntriesByType()
, which only shows resource
performance entries present in the browser's performance timeline at the time you call this method:
const scripts = performance.getEntriesByType("resource").filter((entry) => {
return entry.initiatorType === "script";
});
console.log(scripts);
Specifications
Specification |
---|
Resource Timing # dom-performanceresourcetiming-initiatortype |
Browser compatibility
BCD tables only load in the browser