From 668373c2736de25b1b843cccb38d5cfa4db562ed Mon Sep 17 00:00:00 2001 From: Noam Rosenthal Date: Thu, 18 Aug 2022 16:09:48 +0300 Subject: [PATCH] Add a performance entry type for visibility state changes See https://github.com/w3c/page-visibility/issues/29 and https://github.com/w3c/performance-timeline/issues/105 --- source | 81 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 81 insertions(+) diff --git a/source b/source index ae64a487515..11115e75146 100644 --- a/source +++ b/source @@ -2717,6 +2717,21 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute + +
Performance Timeline
+ +
+

The following terms are defined in Performance Timeline:

+ +
Long Tasks
@@ -76621,6 +76636,14 @@ END:VCARD

  • Set document's visibility state to visibilityState.

    • +

  • Queue a new + VisibilityStateEntry whose + visibility state is + visibilityState and whose timestamp is + the current high resolution time given document's + relevant global object.

    +

  • Run the screen orientation change steps with document.

    • @@ -76641,6 +76664,56 @@ END:VCARD initialized to true.

    +

    The VisibilityStateEntry interface

    + +

    The VisibilityStateEntry interface exposes visibility changes to the document, + from the moment the document becomes active.

    + +
    For example, this allows JavaScript code in the page to examine correlation + between visibility changes and paint timing: + + 
    function wasHiddenBeforeFirstContentfulPaint() {
+    const fcpEntry = performance.getEntriesByName("first-contentful-paint")[0];
+    const visibilityStateEntries = performance.getEntriesByType("visibility-state");
+    return visibilityStateEntries.some(e =>
+                                            e.startTime < fcpEntry.startTime &&
+                                            e.name === "hidden");
+}
    +
    + +

    Since hiding a page can cause throttling of rendering and other user-agent + operations, it is common to use visibility changes as an indication that such throttling has + occurred. However, other things could also cause throttling in different browsers, such as + long periods of inactivity.

    + + 
    [Exposed=(Window)]
+interface VisibilityStateEntry : PerformanceEntry {
+  readonly attribute DOMString name;                 // shadows inherited name
+  readonly attribute DOMString entryType;            // shadows inherited entryType
+  readonly attribute DOMHighResTimeStamp startTime;  // shadows inherited startTime
+  readonly attribute unsigned long duration;         // shadows inherited duration
+};
    + +

    The VisibilityStateEntry has an associated + DOMHighResTimeStamp + timestamp.

    + +

    The VisibilityStateEntry has an associated "visible" or + "hidden" visibility state.

    + +

    The name getter steps are to return + this's visibility state.

    + +

    The entryType getter steps are to return + "visibility-state".

    + +

    The startTime getter steps are to return + this's timestamp.

    + +

    The duration getter steps are to return + zero.

    +

    Inert subtrees

    @@ -94920,6 +94993,11 @@ location.href = '#foo'; node navigable's traversable navigable's system visibility state.

    +

  • Queue a new + VisibilityStateEntry whose visibility + state is document's visibility state and whose timestamp is zero.

    • +

  • Set window's relevant settings object's execution ready flag.

    • @@ -133499,6 +133577,9 @@ INSERT INTERFACES HERE
    [PDF]
    (Non-normative) Document management — Portable document format — Part 1: PDF. ISO.
    +
    [PERFORMANCETIMELINE]
    +
    Performance Timeline, N. Peña Moreno, W3C.
    +
    [PERMISSIONSPOLICY]
    Permissions Policy, I. Clelland, W3C.