From fe85acb3e4856d5c21e3f46003fa1ac634c9da49 Mon Sep 17 00:00:00 2001 From: Patrick Hulce Date: Wed, 20 Jun 2018 13:35:39 -0700 Subject: [PATCH 1/3] core(trace-of-tab): remove DevTools stableSort dependency --- .../audits/mainthread-work-breakdown.js | 4 +- .../gather/computed/trace-of-tab.js | 55 +++++++++++++------ 2 files changed, 41 insertions(+), 18 deletions(-) diff --git a/lighthouse-core/audits/mainthread-work-breakdown.js b/lighthouse-core/audits/mainthread-work-breakdown.js index 3ea3b14d3793..7dfa432d811f 100644 --- a/lighthouse-core/audits/mainthread-work-breakdown.js +++ b/lighthouse-core/audits/mainthread-work-breakdown.js @@ -97,8 +97,8 @@ class MainThreadWorkBreakdown extends Audit { {key: 'category', itemType: 'text', text: 'Work'}, {key: 'duration', itemType: 'ms', granularity: 1, text: 'Time spent'}, ]; - // @ts-ignore - stableSort added to Array by WebInspector - results.stableSort((a, b) => categoryTotals[b.group] - categoryTotals[a.group]); + + results.sort((a, b) => categoryTotals[b.group] - categoryTotals[a.group]); const tableDetails = MainThreadWorkBreakdown.makeTableDetails(headings, results); const score = Audit.computeLogNormalScore( diff --git a/lighthouse-core/gather/computed/trace-of-tab.js b/lighthouse-core/gather/computed/trace-of-tab.js index b4ba0cfc7537..a2d95694a180 100644 --- a/lighthouse-core/gather/computed/trace-of-tab.js +++ b/lighthouse-core/gather/computed/trace-of-tab.js @@ -32,6 +32,36 @@ class TraceOfTab extends ComputedArtifact { return 'TraceOfTab'; } + /** + * @param {LH.TraceEvent[]} traceEvents + * @param {(e: LH.TraceEvent) => boolean} filter + */ + static filteredStableSort(traceEvents, filter) { + const indices = []; + let destIndex = 0; + for (let srcIndex = 0; srcIndex < traceEvents.length; srcIndex++) { + if (filter(traceEvents[srcIndex])) { + indices[destIndex] = srcIndex + destIndex++ + } + } + + // sort by ts, if there's no ts difference sort by index + indices.sort((indexA, indexB) => { + const result = traceEvents[indexA].ts - traceEvents[indexB].ts; + return result ? result : indexA - indexB; + }); + + // create a new array using the target indices from previous sort step + const sortedArray = new Array(indices.length); + for (let i = 0; i < indices.length; i++) { + sortedArray[i] = traceEvents[indices[i]]; + } + + return sortedArray; + } + + /** * Finds key trace events, identifies main process/thread, and returns timings of trace events * in milliseconds since navigation start in addition to the standard microsecond monotonic timestamps. @@ -41,16 +71,12 @@ class TraceOfTab extends ComputedArtifact { async compute_(trace) { // Parse the trace for our key events and sort them by timestamp. Note: sort // *must* be stable to keep events correctly nested. - /** @type Array */ - const keyEvents = trace.traceEvents - .filter(e => { - return e.cat.includes('blink.user_timing') || - e.cat.includes('loading') || - e.cat.includes('devtools.timeline') || - e.cat === '__metadata'; - }) - // @ts-ignore - stableSort added to Array by WebInspector. - .stableSort((event0, event1) => event0.ts - event1.ts); + const keyEvents = TraceOfTab.filteredStableSort(trace.traceEvents, e => { + return e.cat.includes('blink.user_timing') || + e.cat.includes('loading') || + e.cat.includes('devtools.timeline') || + e.cat === '__metadata'; + }); // Find the inspected frame const {startedInPageEvt, frameId} = TracingProcessor.findTracingStartedEvt(keyEvents); @@ -102,14 +128,11 @@ class TraceOfTab extends ComputedArtifact { // subset all trace events to just our tab's process (incl threads other than main) // stable-sort events to keep them correctly nested. - /** @type Array */ - const processEvents = trace.traceEvents - .filter(e => e.pid === /** @type {LH.TraceEvent} */ (startedInPageEvt).pid) - // @ts-ignore - stableSort added to Array by WebInspector. - .stableSort((event0, event1) => event0.ts - event1.ts); + const processEvents = TraceOfTab + .filteredStableSort(trace.traceEvents, e => e.pid === startedInPageEvt.pid); const mainThreadEvents = processEvents - .filter(e => e.tid === /** @type {LH.TraceEvent} */ (startedInPageEvt).tid); + .filter(e => e.tid === startedInPageEvt.tid); const traceEnd = trace.traceEvents.reduce((max, evt) => { return max.ts > evt.ts ? max : evt; From 67bf316a5c9dae0e5f3aa87ef6d6bf21843635b6 Mon Sep 17 00:00:00 2001 From: Patrick Hulce Date: Thu, 21 Jun 2018 10:05:38 -0700 Subject: [PATCH 2/3] fixup --- lighthouse-core/audits/mainthread-work-breakdown.js | 4 ++-- lighthouse-core/gather/computed/trace-of-tab.js | 5 ++--- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/lighthouse-core/audits/mainthread-work-breakdown.js b/lighthouse-core/audits/mainthread-work-breakdown.js index 7dfa432d811f..3ea3b14d3793 100644 --- a/lighthouse-core/audits/mainthread-work-breakdown.js +++ b/lighthouse-core/audits/mainthread-work-breakdown.js @@ -97,8 +97,8 @@ class MainThreadWorkBreakdown extends Audit { {key: 'category', itemType: 'text', text: 'Work'}, {key: 'duration', itemType: 'ms', granularity: 1, text: 'Time spent'}, ]; - - results.sort((a, b) => categoryTotals[b.group] - categoryTotals[a.group]); + // @ts-ignore - stableSort added to Array by WebInspector + results.stableSort((a, b) => categoryTotals[b.group] - categoryTotals[a.group]); const tableDetails = MainThreadWorkBreakdown.makeTableDetails(headings, results); const score = Audit.computeLogNormalScore( diff --git a/lighthouse-core/gather/computed/trace-of-tab.js b/lighthouse-core/gather/computed/trace-of-tab.js index a2d95694a180..453254a459a1 100644 --- a/lighthouse-core/gather/computed/trace-of-tab.js +++ b/lighthouse-core/gather/computed/trace-of-tab.js @@ -37,12 +37,11 @@ class TraceOfTab extends ComputedArtifact { * @param {(e: LH.TraceEvent) => boolean} filter */ static filteredStableSort(traceEvents, filter) { + // create an array of the indices that we want to keep const indices = []; - let destIndex = 0; for (let srcIndex = 0; srcIndex < traceEvents.length; srcIndex++) { if (filter(traceEvents[srcIndex])) { - indices[destIndex] = srcIndex - destIndex++ + indices.push(srcIndex); } } From 5170316a958359c6ebccc0e60f6d271e1cc88797 Mon Sep 17 00:00:00 2001 From: Patrick Hulce Date: Fri, 22 Jun 2018 09:51:20 -0700 Subject: [PATCH 3/3] pack them arrays --- lighthouse-core/gather/computed/trace-of-tab.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lighthouse-core/gather/computed/trace-of-tab.js b/lighthouse-core/gather/computed/trace-of-tab.js index 453254a459a1..ec9da3425738 100644 --- a/lighthouse-core/gather/computed/trace-of-tab.js +++ b/lighthouse-core/gather/computed/trace-of-tab.js @@ -52,12 +52,12 @@ class TraceOfTab extends ComputedArtifact { }); // create a new array using the target indices from previous sort step - const sortedArray = new Array(indices.length); + const sorted = []; for (let i = 0; i < indices.length; i++) { - sortedArray[i] = traceEvents[indices[i]]; + sorted.push(traceEvents[indices[i]]); } - return sortedArray; + return sorted; }