Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 | 17x 33x 3x 30x 30x 6x 30x 30x 3x 30x 33x 3x 3x 3x 3x 3x 1x 2x 189x 7x 7x 7x 6x 6x 6x 18x 14x 25x 30x 30x 30x 30x 30x 3x 30x 3x 30x | import { mergeUrlParams } from '~/lib/utils/url_utility';
import { sprintf, s__ } from '~/locale';
export default class PerformanceBarStore {
constructor() {
this.requests = [];
}
addRequest(requestId, requestUrl, operationName, requestParams, methodVerb) {
if (this.findRequest(requestId)) {
this.updateRequestBatchedQueriesCount(requestId);
} else {
let displayName = '';
if (methodVerb) {
displayName += `${methodVerb.toUpperCase()} `;
}
displayName += PerformanceBarStore.truncateUrl(requestUrl);
if (operationName) {
displayName += ` (${operationName})`;
}
this.requests.push({
id: requestId,
url: requestUrl,
fullUrl: mergeUrlParams(requestParams, requestUrl),
method: methodVerb,
details: {},
queriesInBatch: 1, // only for GraphQL
displayName,
});
}
return this.requests;
}
updateRequestBatchedQueriesCount(requestId) {
const existingRequest = this.findRequest(requestId);
existingRequest.queriesInBatch += 1;
const originalDisplayName = existingRequest.displayName;
const regex = /\d+ queries batched/;
if (regex.test(originalDisplayName)) {
existingRequest.displayName = originalDisplayName.replace(
regex,
sprintf(s__('PerformanceBar|%{queryCount} queries batched'), {
queryCount: existingRequest.queriesInBatch,
}),
);
} else {
existingRequest.displayName = sprintf(
s__('PerformanceBar|%{originalDisplayName} [%{queryCount} queries batched]'),
{
originalDisplayName,
queryCount: existingRequest.queriesInBatch,
},
);
}
}
findRequest(requestId) {
return this.requests.find((request) => request.id === requestId);
}
addRequestDetails(requestId, requestDetails) {
const request = this.findRequest(requestId);
request.details = requestDetails.data;
return request;
}
setRequestDetailsData(requestId, metricKey, requestDetailsData) {
const selectedRequest = this.findRequest(requestId);
Eif (selectedRequest) {
selectedRequest.details = {
...selectedRequest.details,
[metricKey]: requestDetailsData,
};
}
}
requestsWithDetails() {
return this.requests.filter((request) => request.details);
}
canTrackRequest(requestUrl) {
// We want to store at most 2 unique requests per URL, as additional
// requests to the same URL probably aren't very interesting.
//
// GraphQL requests are the exception: because all GraphQL requests
// go to the same URL, we set a higher limit of 10 to allow
// capturing different queries a page may make.
const requestsLimit = requestUrl.endsWith('/api/graphql') ? 10 : 2;
return this.requests.filter((request) => request.url === requestUrl).length < requestsLimit;
}
static truncateUrl(requestUrl) {
const [rootAndQuery] = requestUrl.split('#');
const [root, query] = rootAndQuery.split('?');
const components = root.replace(/\/$/, '').split('/');
let truncated = components[components.length - 1];
if (truncated.match(/^\d+$/)) {
truncated = `${components[components.length - 2]}/${truncated}`;
}
if (query) {
truncated += `?${query}`;
}
return truncated;
}
}
|