-
Notifications
You must be signed in to change notification settings - Fork 237
/
PageViewPerformanceManager.ts
221 lines (192 loc) · 10.4 KB
/
PageViewPerformanceManager.ts
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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
// Copyright (c) Microsoft Corporation. All rights reserved.
// Licensed under the MIT License.
import dynamicProto from "@microsoft/dynamicproto-js";
import { IPageViewPerformanceTelemetryInternal, dateTimeUtilsDuration, msToTimeSpan } from "@microsoft/applicationinsights-common";
import {
IAppInsightsCore, IDiagnosticLogger, _eInternalMessageId, _throwInternal, eLoggingSeverity, getNavigator, getPerformance, safeGetLogger
} from "@microsoft/applicationinsights-core-js";
import { strIndexOf } from "@nevware21/ts-utils";
const MAX_DURATION_ALLOWED = 3600000; // 1h
const botAgentNames = ["googlebot", "adsbot-google", "apis-google", "mediapartners-google"];
function _isPerformanceTimingSupported() {
let perf = getPerformance();
return perf && !!perf.timing;
}
function _isPerformanceNavigationTimingSupported() {
let perf = getPerformance();
return perf && perf.getEntriesByType && perf.getEntriesByType("navigation").length > 0;
}
function _isPerformanceTimingDataReady() {
let perf = getPerformance();
const timing = perf ? perf.timing : 0;
return timing
&& timing.domainLookupStart > 0
&& timing.navigationStart > 0
&& timing.responseStart > 0
&& timing.requestStart > 0
&& timing.loadEventEnd > 0
&& timing.responseEnd > 0
&& timing.connectEnd > 0
&& timing.domLoading > 0;
}
function _getPerformanceTiming(): PerformanceTiming | null {
if (_isPerformanceTimingSupported()) {
return getPerformance().timing;
}
return null;
}
function _getPerformanceNavigationTiming(): PerformanceNavigationTiming | null {
if (_isPerformanceNavigationTimingSupported()) {
return getPerformance().getEntriesByType("navigation")[0] as PerformanceNavigationTiming;
}
return null;
}
/**
* This method tells if given durations should be excluded from collection.
*/
function _shouldCollectDuration(...durations: number[]): boolean {
var _navigator = getNavigator() || {} as any;
// a full list of Google crawlers user agent strings - https://support.google.com/webmasters/answer/1061943?hl=en
const userAgent = _navigator.userAgent;
let isGoogleBot = false;
if (userAgent) {
for (let i = 0; i < botAgentNames.length; i++) {
isGoogleBot = isGoogleBot || strIndexOf(userAgent.toLowerCase(), botAgentNames[i]) !== -1;
}
}
if (isGoogleBot) {
// Don't report durations for GoogleBot, it is returning invalid values in performance.timing API.
return false;
} else {
// for other page views, don't report if it's outside of a reasonable range
for (let i = 0; i < durations.length; i++) {
if (durations[i] < 0 || durations[i] >= MAX_DURATION_ALLOWED) {
return false;
}
}
}
return true;
}
/**
* Class encapsulates sending page view performance telemetry.
*/
export class PageViewPerformanceManager {
constructor(core: IAppInsightsCore) {
let _logger: IDiagnosticLogger = safeGetLogger(core);
dynamicProto(PageViewPerformanceManager, this, (_self) => {
_self.populatePageViewPerformanceEvent = (pageViewPerformance: IPageViewPerformanceTelemetryInternal): void => {
pageViewPerformance.isValid = false;
/*
* http://www.w3.org/TR/navigation-timing/#processing-model
* |-navigationStart
* | |-connectEnd
* | ||-requestStart
* | || |-responseStart
* | || | |-responseEnd
* | || | |
* | || | | |-loadEventEnd
* |---network---||---request---|---response---|---dom---|
* |--------------------------total----------------------|
*
* total = The difference between the load event of the current document is completed and the first recorded timestamp of the performance entry : https://developer.mozilla.org/en-US/docs/Web/Performance/Navigation_and_resource_timings#duration
* network = Redirect time + App Cache + DNS lookup time + TCP connection time
* request = Request time : https://developer.mozilla.org/en-US/docs/Web/Performance/Navigation_and_resource_timings#request_time
* response = Response time
* dom = Document load time : https://html.spec.whatwg.org/multipage/dom.html#document-load-timing-info
* = Document processing time : https://developers.google.com/web/fundamentals/performance/navigation-and-resource-timing/#document_processing
* + Loading time : https://developers.google.com/web/fundamentals/performance/navigation-and-resource-timing/#loading
*/
const navigationTiming = _getPerformanceNavigationTiming();
const timing = _getPerformanceTiming();
let total = 0;
let network = 0;
let request = 0;
let response = 0;
let dom = 0;
if (navigationTiming || timing) {
if (navigationTiming) {
total = navigationTiming.duration;
/**
* support both cases:
* - startTime is always zero: https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNavigationTiming
* - for older browsers where the startTime is not zero
*/
network = navigationTiming.startTime === 0 ? navigationTiming.connectEnd : dateTimeUtilsDuration(navigationTiming.startTime, navigationTiming.connectEnd);
request = dateTimeUtilsDuration(navigationTiming.requestStart, navigationTiming.responseStart);
response = dateTimeUtilsDuration(navigationTiming.responseStart, navigationTiming.responseEnd);
dom = dateTimeUtilsDuration(navigationTiming.responseEnd, navigationTiming.loadEventEnd);
} else {
total = dateTimeUtilsDuration(timing.navigationStart, timing.loadEventEnd);
network = dateTimeUtilsDuration(timing.navigationStart, timing.connectEnd);
request = dateTimeUtilsDuration(timing.requestStart, timing.responseStart);
response = dateTimeUtilsDuration(timing.responseStart, timing.responseEnd);
dom = dateTimeUtilsDuration(timing.responseEnd, timing.loadEventEnd);
}
if (total === 0) {
_throwInternal(_logger,
eLoggingSeverity.WARNING,
_eInternalMessageId.ErrorPVCalc,
"error calculating page view performance.",
{ total, network, request, response, dom });
} else if (!_self.shouldCollectDuration(total, network, request, response, dom)) {
_throwInternal(_logger,
eLoggingSeverity.WARNING,
_eInternalMessageId.InvalidDurationValue,
"Invalid page load duration value. Browser perf data won't be sent.",
{ total, network, request, response, dom });
} else if (total < Math.floor(network) + Math.floor(request) + Math.floor(response) + Math.floor(dom)) {
// some browsers may report individual components incorrectly so that the sum of the parts will be bigger than total PLT
// in this case, don't report client performance from this page
_throwInternal(_logger,
eLoggingSeverity.WARNING,
_eInternalMessageId.ClientPerformanceMathError,
"client performance math error.",
{ total, network, request, response, dom });
} else {
pageViewPerformance.durationMs = total;
// // convert to timespans
pageViewPerformance.perfTotal = pageViewPerformance.duration = msToTimeSpan(total);
pageViewPerformance.networkConnect = msToTimeSpan(network);
pageViewPerformance.sentRequest = msToTimeSpan(request);
pageViewPerformance.receivedResponse = msToTimeSpan(response);
pageViewPerformance.domProcessing = msToTimeSpan(dom);
pageViewPerformance.isValid = true;
}
}
}
_self.getPerformanceTiming = _getPerformanceTiming;
_self.isPerformanceTimingSupported = _isPerformanceTimingSupported;
_self.isPerformanceTimingDataReady = _isPerformanceTimingDataReady;
_self.shouldCollectDuration = _shouldCollectDuration;
});
}
public populatePageViewPerformanceEvent(pageViewPerformance: IPageViewPerformanceTelemetryInternal): void {
// @DynamicProtoStub -- DO NOT add any code as this will be removed during packaging
}
public getPerformanceTiming(): PerformanceTiming | null {
// @DynamicProtoStub -- DO NOT add any code as this will be removed during packaging
return null;
}
/**
* Returns true is window performance timing API is supported, false otherwise.
*/
public isPerformanceTimingSupported() {
// @DynamicProtoStub -- DO NOT add any code as this will be removed during packaging
return true;
}
/**
* As page loads different parts of performance timing numbers get set. When all of them are set we can report it.
* Returns true if ready, false otherwise.
*/
public isPerformanceTimingDataReady() {
// @DynamicProtoStub -- DO NOT add any code as this will be removed during packaging
return true;
}
/**
* This method tells if given durations should be excluded from collection.
*/
public shouldCollectDuration(...durations: number[]): boolean {
// @DynamicProtoStub -- DO NOT add any code as this will be removed during packaging
return true;
}
}