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
.
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's src
attribute.
beacon
-
If the request was initiated by a navigator.sendBeacon()
method.
body
-
If the request was initiated by a <body>
element's background
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's src
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's src
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's src
or srcset
attribute.
input
-
If the request was initiated by an <input>
element of type image
.
link
-
If the request was initiated by a <link>
element.
navigation
-
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's ping
.
script
-
If the request was initiated by a <script>
element.
track
-
If the request was initiated by a <track>
element's src
.
video
-
If the request was initiated by a <video>
element's poster
or src
.
xmlhttprequest
-
If the request was initiated by an XMLHttpRequest
.
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);