Begin to add performance marks

yomidevs · Feb 17, 2024 · c50519e · c50519e
1 parent 4aaa9f1
commit c50519e
Showing 1 changed file with 24 additions and 0 deletions.
diff --git a/ext/js/display/display.js b/ext/js/display/display.js
@@ -751,11 +751,14 @@ export class Display extends EventDispatcher {
     async _onStateChanged() {
         if (this._historyChangeIgnore) { return; }
 
+        performance.mark('display:onStateChanged:start');
+
         /** @type {?import('core').TokenObject} */
         const token = {}; // Unique identifier token
         this._setContentToken = token;
         try {
             // Clear
+            performance.mark('display:clear:start');
             this._closePopups();
             this._closeAllPopupMenus();
             this._eventListeners.removeAllEventListeners();
@@ -765,8 +768,11 @@ export class Display extends EventDispatcher {
             this._dictionaryEntries = [];
             this._dictionaryEntryNodes = [];
             this._elementOverflowController.clearElements();
+            performance.mark('display:clear:end');
+            performance.measure('display:clear', 'display:clear:start', 'display:clear:end');
 
             // Prepare
+            performance.mark('display:prepare:start');
             const urlSearchParams = new URLSearchParams(location.search);
             let type = urlSearchParams.get('type');
             if (type === null && urlSearchParams.get('query') !== null) { type = 'terms'; }
@@ -775,7 +781,10 @@ export class Display extends EventDispatcher {
             this._queryParserVisibleOverride = (fullVisible === null ? null : (fullVisible !== 'false'));
 
             this._historyHasChanged = true;
+            performance.mark('display:prepare:end');
+            performance.measure('display:prepare', 'display:prepare:start', 'display:prepare:end');
 
+            performance.mark('display:setContent:start');
             // Set content
             switch (type) {
                 case 'terms':
@@ -792,9 +801,13 @@ export class Display extends EventDispatcher {
                     this._clearContent();
                     break;
             }
+            performance.mark('display:setContent:end');
+            performance.measure('display:setContent', 'display:setContent:start', 'display:setContent:end');
         } catch (e) {
             this.onError(toError(e));
         }
+        performance.mark('display:onStateChanged:end');
+        performance.measure('display:onStateChanged', 'display:onStateChanged:start', 'display:onStateChanged:end');
     }
 
     /**
@@ -1179,6 +1192,7 @@ export class Display extends EventDispatcher {
         const wildcardsEnabled = (urlSearchParams.get('wildcards') !== 'off');
 
         // Set query
+        performance.mark('display:setQuery:start');
         let query = urlSearchParams.get('query');
         if (query === null) { query = ''; }
         let queryFull = urlSearchParams.get('full');
@@ -1190,6 +1204,8 @@ export class Display extends EventDispatcher {
             queryOffset = Number.isFinite(queryOffset) ? Math.max(0, Math.min(queryFull.length - query.length, queryOffset)) : 0;
         }
         this._setQuery(query, queryFull, queryOffset);
+        performance.mark('display:setQuery:end');
+        performance.measure('display:setQuery', 'display:setQuery:start', 'display:setQuery:end');
 
         let {state, content} = this._history;
         let changeHistory = false;
@@ -1253,9 +1269,12 @@ export class Display extends EventDispatcher {
         const container = this._container;
         container.textContent = '';
 
+        performance.mark('display:contentUpdate:start');
         this._triggerContentUpdateStart();
 
         for (let i = 0, ii = dictionaryEntries.length; i < ii; ++i) {
+            performance.mark('display:createEntry:start');
+
             if (i > 0) {
                 await promiseTimeout(1);
                 if (this._setContentToken !== token) { return; }
@@ -1277,6 +1296,9 @@ export class Display extends EventDispatcher {
             }
 
             this._elementOverflowController.addElements(entry);
+
+            performance.mark('display:createEntry:end');
+            performance.measure('display:createEntry', 'display:createEntry:start', 'display:createEntry:end');
         }
 
         if (typeof scrollX === 'number' || typeof scrollY === 'number') {
@@ -1288,6 +1310,8 @@ export class Display extends EventDispatcher {
         }
 
         this._triggerContentUpdateComplete();
+        performance.mark('display:contentUpdate:end');
+        performance.measure('display:contentUpdate', 'display:contentUpdate:start', 'display:contentUpdate:end');
     }
 
     /** */