|
| 1 | +/** |
| 2 | + * Copyright 2019, OpenCensus Authors |
| 3 | + * |
| 4 | + * Licensed under the Apache License, Version 2.0 (the "License"); |
| 5 | + * you may not use this file except in compliance with the License. |
| 6 | + * You may obtain a copy of the License at |
| 7 | + * |
| 8 | + * http://www.apache.org/licenses/LICENSE-2.0 |
| 9 | + * |
| 10 | + * Unless required by applicable law or agreed to in writing, software |
| 11 | + * distributed under the License is distributed on an "AS IS" BASIS, |
| 12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| 13 | + * See the License for the specific language governing permissions and |
| 14 | + * limitations under the License. |
| 15 | + */ |
| 16 | + |
| 17 | +import { Span } from '@opencensus/web-core'; |
| 18 | +import { XhrPerformanceResourceTiming } from './zone-types'; |
| 19 | + |
| 20 | +/** |
| 21 | + * Get Browser's performance resource timing data associated to a XHR. |
| 22 | + * For this case, some XHR might have two or one performance resource |
| 23 | + * timings as one of them is CORS pre-flight request and the second is related |
| 24 | + * to the actual HTTP request. |
| 25 | + * The algorithm to select performance resource timings related to that xhr is |
| 26 | + * is composed in general by three steps: |
| 27 | + * |
| 28 | + * 1. Filter the Performance Resource Timings by the name (it should match the |
| 29 | + * XHR URL), additionally, the start/end timings of every performance entry |
| 30 | + * should fit within the span start/end timings. These filtered performance |
| 31 | + * resource entries are considered as possible entries associated to the xhr. |
| 32 | + * Those are possible as there might be more than two entries that pass the |
| 33 | + * filter. |
| 34 | + * |
| 35 | + * 2. As the XHR could cause a CORS pre-flight, we have to look for either |
| 36 | + * possible pairs of performance resource timings or a single performance |
| 37 | + * resource entry (a possible pair is when a resource timing entry does not |
| 38 | + * overlap timings with other resource timing entry. Also, a possible single |
| 39 | + * resource timing is when that resource timing entry is not paired with any |
| 40 | + * other entry). Thus, for this step traverse the array of possible resource |
| 41 | + * entries and for every entry try to pair it with the other possible entries. |
| 42 | + * |
| 43 | + * 3. Pick the best performance resource timing for the XHR: Using the possible |
| 44 | + * performance resource timing entries from previous step, the best entry will |
| 45 | + * be the one with the minimum gap to the span start/end timings. That is the |
| 46 | + * substraction between the entry `respondeEnd` value and the span |
| 47 | + * `endPerfTime` plus the substraction between the entry `startTime` and span |
| 48 | + * `startPerfTime`. In case it is a tuple, the `startTime` corresponds to the |
| 49 | + * first entry and the `responseEnd` is from second entry. |
| 50 | + * The performance resource timing entry with the minimum gap to the span |
| 51 | + * start/end timings points out that entry is the best fit for the span. |
| 52 | + * |
| 53 | + * @param xhrUrl |
| 54 | + * @param span |
| 55 | + */ |
| 56 | +export function getXhrPerfomanceData( |
| 57 | + xhrUrl: string, |
| 58 | + span: Span |
| 59 | +): XhrPerformanceResourceTiming | undefined { |
| 60 | + const filteredPerfEntries = getPerfResourceEntries(xhrUrl, span); |
| 61 | + const possibleEntries = getPossiblePerfResourceEntries(filteredPerfEntries); |
| 62 | + const bestEntry = getBestPerfResourceTiming(possibleEntries, span); |
| 63 | + return bestEntry; |
| 64 | +} |
| 65 | + |
| 66 | +// Get Performance Resource Timings and filter them by matching the XHR url |
| 67 | +// with perfomance entry name. Additionally, the entry's start/end |
| 68 | +// timings must fit with in the span's start/end timings. |
| 69 | +export function getPerfResourceEntries( |
| 70 | + xhrUrl: string, |
| 71 | + span: Span |
| 72 | +): PerformanceResourceTiming[] { |
| 73 | + return performance |
| 74 | + .getEntriesByType('resource') |
| 75 | + .filter(entry => |
| 76 | + isPerfEntryPartOfXhr(entry as PerformanceResourceTiming, xhrUrl, span) |
| 77 | + ) as PerformanceResourceTiming[]; |
| 78 | +} |
| 79 | + |
| 80 | +export function getPossiblePerfResourceEntries( |
| 81 | + perfEntries: PerformanceResourceTiming[] |
| 82 | +): XhrPerformanceResourceTiming[] { |
| 83 | + const possiblePerfEntries = new Array<XhrPerformanceResourceTiming>(); |
| 84 | + const pairedEntries = new Set<PerformanceResourceTiming>(); |
| 85 | + let perfEntry1: PerformanceResourceTiming; |
| 86 | + let perfEntry2: PerformanceResourceTiming; |
| 87 | + // As this part of the algorithm traverses the array twice, although, |
| 88 | + // this array is not big as the performance resource entries is cleared |
| 89 | + // when there are no more running XHRs. |
| 90 | + for (let i = 0; i < perfEntries.length; i++) { |
| 91 | + perfEntry1 = perfEntries[i]; |
| 92 | + // Compare every performance entry with its consecutive perfomance entries. |
| 93 | + // That way to avoid comparing twice the entries. |
| 94 | + for (let j = i + 1; j < perfEntries.length; j++) { |
| 95 | + perfEntry2 = perfEntries[j]; |
| 96 | + if (!overlappingPerfResourceTimings(perfEntry1, perfEntry2)) { |
| 97 | + // As the entries are not overlapping, that means those timings |
| 98 | + // are possible perfomance timings related to the XHR. |
| 99 | + possiblePerfEntries.push([perfEntry1, perfEntry2]); |
| 100 | + pairedEntries.add(perfEntry1); |
| 101 | + pairedEntries.add(perfEntry2); |
| 102 | + } |
| 103 | + } |
| 104 | + // If the entry1 couldn't be paired with any other resource timing, |
| 105 | + // add it as a single resource timing. This is possible because this |
| 106 | + // single entry might be better that the other possible entries. |
| 107 | + if (!pairedEntries.has(perfEntry1)) { |
| 108 | + possiblePerfEntries.push(perfEntry1 as PerformanceResourceTiming); |
| 109 | + } |
| 110 | + } |
| 111 | + return possiblePerfEntries; |
| 112 | +} |
| 113 | + |
| 114 | +// The best Performance Resource Timing Entry is considered the one with the |
| 115 | +// minimum gap the span end/start timings. That way we think that it fits |
| 116 | +// better to the XHR as it is the closest data to the actual XHR. |
| 117 | +function getBestPerfResourceTiming( |
| 118 | + perfEntries: XhrPerformanceResourceTiming[], |
| 119 | + span: Span |
| 120 | +): XhrPerformanceResourceTiming | undefined { |
| 121 | + let minimumGapToSpan = Number.MAX_VALUE; |
| 122 | + let bestPerfEntry: XhrPerformanceResourceTiming | undefined = undefined; |
| 123 | + let sumGapsToSpan: number; |
| 124 | + for (const perfEntry of perfEntries) { |
| 125 | + // As a Tuple is in the end an Array, check that perfEntry is instance of |
| 126 | + // Array is enough to know if this value refers to a Tuple. |
| 127 | + if (perfEntry instanceof Array) { |
| 128 | + sumGapsToSpan = Math.abs(perfEntry[0].startTime - span.startPerfTime); |
| 129 | + sumGapsToSpan += Math.abs(perfEntry[1].responseEnd - span.endPerfTime); |
| 130 | + } else { |
| 131 | + sumGapsToSpan = Math.abs(perfEntry.responseEnd - span.endPerfTime); |
| 132 | + sumGapsToSpan += Math.abs(perfEntry.startTime - span.startPerfTime); |
| 133 | + } |
| 134 | + // If there is a new minimum gap to the span, update the minimum and pick |
| 135 | + // the current performance entry as the best at this point. |
| 136 | + if (sumGapsToSpan < minimumGapToSpan) { |
| 137 | + minimumGapToSpan = sumGapsToSpan; |
| 138 | + bestPerfEntry = perfEntry; |
| 139 | + } |
| 140 | + } |
| 141 | + return bestPerfEntry; |
| 142 | +} |
| 143 | + |
| 144 | +function isPerfEntryPartOfXhr( |
| 145 | + entry: PerformanceResourceTiming, |
| 146 | + xhrUrl: string, |
| 147 | + span: Span |
| 148 | +): boolean { |
| 149 | + return ( |
| 150 | + entry.name === xhrUrl && |
| 151 | + entry.startTime >= span.startPerfTime && |
| 152 | + entry.responseEnd <= span.endPerfTime |
| 153 | + ); |
| 154 | +} |
| 155 | + |
| 156 | +function overlappingPerfResourceTimings( |
| 157 | + entry1: PerformanceResourceTiming, |
| 158 | + entry2: PerformanceResourceTiming |
| 159 | +): boolean { |
| 160 | + return ( |
| 161 | + Math.min(entry1.responseEnd, entry2.responseEnd) >= |
| 162 | + Math.max(entry1.startTime, entry2.startTime) |
| 163 | + ); |
| 164 | +} |
0 commit comments