@atlaskit/react-ufo 3.4.2 → 3.4.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -0
- package/dist/cjs/create-payload/index.js +1 -1
- package/dist/cjs/vc/index.js +23 -2
- package/dist/cjs/vc/no-op-vc-observer.js +44 -0
- package/dist/cjs/vc/vc-observer/index.js +11 -8
- package/dist/es2019/create-payload/index.js +1 -1
- package/dist/es2019/vc/index.js +23 -2
- package/dist/es2019/vc/no-op-vc-observer.js +17 -0
- package/dist/es2019/vc/vc-observer/index.js +9 -6
- package/dist/esm/create-payload/index.js +1 -1
- package/dist/esm/vc/index.js +23 -2
- package/dist/esm/vc/no-op-vc-observer.js +37 -0
- package/dist/esm/vc/vc-observer/index.js +11 -8
- package/dist/types/vc/no-op-vc-observer.d.ts +13 -0
- package/dist/types-ts4.5/vc/no-op-vc-observer.d.ts +13 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/ufo-interaction-ignore
|
|
2
2
|
|
|
3
|
+
## 3.4.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#127813](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/127813)
|
|
8
|
+
[`8b9582e990f11`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8b9582e990f11) -
|
|
9
|
+
Adding additional check to ensure that process variable is defined
|
|
10
|
+
|
|
11
|
+
## 3.4.3
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [#127288](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/127288)
|
|
16
|
+
[`ee26211b6cd7a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ee26211b6cd7a) -
|
|
17
|
+
Optimisation for VC v3
|
|
18
|
+
|
|
3
19
|
## 3.4.2
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
package/dist/cjs/vc/index.js
CHANGED
|
@@ -13,8 +13,10 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/cl
|
|
|
13
13
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
14
14
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
15
15
|
var _config = require("../config");
|
|
16
|
+
var _noOpVcObserver = require("./no-op-vc-observer");
|
|
16
17
|
var _vcObserver = require("./vc-observer");
|
|
17
18
|
var _vcObserverNew = _interopRequireDefault(require("./vc-observer-new"));
|
|
19
|
+
var _process;
|
|
18
20
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
19
21
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
20
22
|
var VCObserverWrapper = /*#__PURE__*/function () {
|
|
@@ -22,7 +24,6 @@ var VCObserverWrapper = /*#__PURE__*/function () {
|
|
|
22
24
|
var _getConfig;
|
|
23
25
|
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
24
26
|
(0, _classCallCheck2.default)(this, VCObserverWrapper);
|
|
25
|
-
this.oldVCObserver = new _vcObserver.VCObserver(opts);
|
|
26
27
|
this.newVCObserver = null;
|
|
27
28
|
var isNewVCObserverEnabled = (0, _platformFeatureFlags.fg)('platform_ufo_vc_observer_new') || ((_getConfig = (0, _config.getConfig)()) === null || _getConfig === void 0 || (_getConfig = _getConfig.vc) === null || _getConfig === void 0 ? void 0 : _getConfig.enableVCObserverNew);
|
|
28
29
|
if (isNewVCObserverEnabled) {
|
|
@@ -30,6 +31,7 @@ var VCObserverWrapper = /*#__PURE__*/function () {
|
|
|
30
31
|
selectorConfig: opts.selectorConfig
|
|
31
32
|
});
|
|
32
33
|
}
|
|
34
|
+
this.oldVCObserver = new _vcObserver.VCObserver(opts);
|
|
33
35
|
}
|
|
34
36
|
return (0, _createClass2.default)(VCObserverWrapper, [{
|
|
35
37
|
key: "start",
|
|
@@ -113,10 +115,29 @@ var VCObserverWrapper = /*#__PURE__*/function () {
|
|
|
113
115
|
}
|
|
114
116
|
}]);
|
|
115
117
|
}();
|
|
118
|
+
var isServer = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.__SERVER__);
|
|
119
|
+
var isReactSSR = isServer && Boolean(((_process = process) === null || _process === void 0 ? void 0 : _process.env.REACT_SSR) || false);
|
|
120
|
+
function isEnvironmentSupported() {
|
|
121
|
+
// SSR environment aren't supported
|
|
122
|
+
if (isReactSSR) {
|
|
123
|
+
return false;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
// Legacy browsers that doesn't support WeakRef
|
|
127
|
+
// aren't valid
|
|
128
|
+
if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.WeakRef) !== 'function') {
|
|
129
|
+
return false;
|
|
130
|
+
}
|
|
131
|
+
if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.MutationObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.IntersectionObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.PerformanceObserver) !== 'function') {
|
|
132
|
+
return false;
|
|
133
|
+
}
|
|
134
|
+
return true;
|
|
135
|
+
}
|
|
116
136
|
var getVCObserver = exports.getVCObserver = function getVCObserver() {
|
|
117
137
|
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
118
138
|
if (!globalThis.__vcObserver) {
|
|
119
|
-
|
|
139
|
+
var shouldMockVCObserver = !isEnvironmentSupported();
|
|
140
|
+
globalThis.__vcObserver = shouldMockVCObserver ? new _noOpVcObserver.VCObserverNOOP() : new VCObserverWrapper(opts);
|
|
120
141
|
}
|
|
121
142
|
return globalThis.__vcObserver;
|
|
122
143
|
};
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.VCObserverNOOP = void 0;
|
|
8
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
9
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
10
|
+
// This class should be used on scenarios where VC can not be calculate
|
|
11
|
+
// such as: SSR environment and legacy browsers
|
|
12
|
+
var VCObserverNOOP = exports.VCObserverNOOP = /*#__PURE__*/function () {
|
|
13
|
+
function VCObserverNOOP() {
|
|
14
|
+
(0, _classCallCheck2.default)(this, VCObserverNOOP);
|
|
15
|
+
}
|
|
16
|
+
return (0, _createClass2.default)(VCObserverNOOP, [{
|
|
17
|
+
key: "start",
|
|
18
|
+
value: function start(startArg) {}
|
|
19
|
+
}, {
|
|
20
|
+
key: "stop",
|
|
21
|
+
value: function stop() {}
|
|
22
|
+
}, {
|
|
23
|
+
key: "getVCRawData",
|
|
24
|
+
value: function getVCRawData() {
|
|
25
|
+
return null;
|
|
26
|
+
}
|
|
27
|
+
}, {
|
|
28
|
+
key: "getVCResult",
|
|
29
|
+
value: function getVCResult(param) {
|
|
30
|
+
return Promise.resolve({
|
|
31
|
+
'ufo:vc:noop': true
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
}, {
|
|
35
|
+
key: "setSSRElement",
|
|
36
|
+
value: function setSSRElement(element) {}
|
|
37
|
+
}, {
|
|
38
|
+
key: "setReactRootRenderStart",
|
|
39
|
+
value: function setReactRootRenderStart(startTime) {}
|
|
40
|
+
}, {
|
|
41
|
+
key: "setReactRootRenderStop",
|
|
42
|
+
value: function setReactRootRenderStop(stopTime) {}
|
|
43
|
+
}]);
|
|
44
|
+
}();
|
|
@@ -14,6 +14,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
|
|
|
14
14
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
15
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
16
16
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
17
|
+
var _hiddenTiming = require("../../hidden-timing");
|
|
17
18
|
var _attachAbortListeners = require("./attachAbortListeners");
|
|
18
19
|
var _getViewport = require("./getViewport");
|
|
19
20
|
var _heatmap = require("./heatmap/heatmap");
|
|
@@ -103,7 +104,7 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
|
|
|
103
104
|
});
|
|
104
105
|
(0, _defineProperty2.default)(this, "getVCResult", /*#__PURE__*/function () {
|
|
105
106
|
var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref3) {
|
|
106
|
-
var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
|
|
107
|
+
var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, pageVisibilityUpToTTAI, shouldHaveVCmetric, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
|
|
107
108
|
return _regenerator.default.wrap(function _callee$(_context) {
|
|
108
109
|
while (1) switch (_context.prev = _context.next) {
|
|
109
110
|
case 0:
|
|
@@ -242,28 +243,30 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
|
|
|
242
243
|
}
|
|
243
244
|
isVCClean = !abortReasonInfo;
|
|
244
245
|
isMultiHeatmapEnabled = !(0, _platformFeatureFlags.fg)('platform_ufo_multiheatmap_killswitch');
|
|
246
|
+
pageVisibilityUpToTTAI = (0, _hiddenTiming.getPageVisibilityState)(start, stop);
|
|
247
|
+
shouldHaveVCmetric = isVCClean && !isEventAborted && pageVisibilityUpToTTAI;
|
|
245
248
|
revisionsData = isMultiHeatmapEnabled ? (0, _platformFeatureFlags.fg)('platform_ufo_vc_observer_new') ? (0, _defineProperty2.default)({}, "".concat(fullPrefix, "vc:rev"), [{
|
|
246
249
|
revision: 'fy25.01',
|
|
247
250
|
clean: isVCClean,
|
|
248
|
-
'metric:vc90': VC['90'],
|
|
249
|
-
vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
251
|
+
'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
|
|
252
|
+
vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
250
253
|
var _VCBox$key;
|
|
251
254
|
return [key, {
|
|
252
255
|
t: VC[key],
|
|
253
256
|
e: (_VCBox$key = VCBox[key]) !== null && _VCBox$key !== void 0 ? _VCBox$key : []
|
|
254
257
|
}];
|
|
255
|
-
}))
|
|
258
|
+
})) : []
|
|
256
259
|
}, {
|
|
257
260
|
revision: 'fy25.02',
|
|
258
261
|
clean: isVCClean,
|
|
259
|
-
'metric:vc90':
|
|
260
|
-
vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
262
|
+
'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
|
|
263
|
+
vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
261
264
|
var _vcNext$VCBox$key;
|
|
262
265
|
return [key, {
|
|
263
266
|
t: vcNext.VC[key],
|
|
264
267
|
e: (_vcNext$VCBox$key = vcNext.VCBox[key]) !== null && _vcNext$VCBox$key !== void 0 ? _vcNext$VCBox$key : []
|
|
265
268
|
}];
|
|
266
|
-
}))
|
|
269
|
+
})) : []
|
|
267
270
|
}]) : multiHeatmap !== null ? (0, _defineProperty2.default)({}, "".concat(fullPrefix, "vc:rev"), multiHeatmap === null || multiHeatmap === void 0 ? void 0 : multiHeatmap.getPayloadShapedData({
|
|
268
271
|
VCParts: VCObserver.VCParts.map(function (v) {
|
|
269
272
|
return parseInt(v);
|
|
@@ -287,7 +290,7 @@ var VCObserver = exports.VCObserver = /*#__PURE__*/function () {
|
|
|
287
290
|
return _context.abrupt("return", _objectSpread(_objectSpread(_objectSpread((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
|
|
288
291
|
'metrics:vc': VC
|
|
289
292
|
}, "".concat(fullPrefix, "vc:state"), true), "".concat(fullPrefix, "vc:clean"), isVCClean), "".concat(fullPrefix, "vc:dom"), VCBox), "".concat(fullPrefix, "vc:updates"), VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:size"), viewport), "".concat(fullPrefix, "vc:time"), Math.round(totalTime + (stopTime - startTime))), "".concat(fullPrefix, "vc:total"), totalPainted), "".concat(fullPrefix, "vc:ratios"), ratios), outOfBoundary), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(fullPrefix, "vc:next"), vcNext.VC), "".concat(fullPrefix, "vc:next:updates"), vcNext.VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:next:dom"), vcNext.VCBox), "".concat(fullPrefix, "vc:ignored"), _this.getIgnoredElements(componentsLog)), revisionsData), isCalcSpeedIndexEnabled ? speedIndex : {}));
|
|
290
|
-
case
|
|
293
|
+
case 27:
|
|
291
294
|
case "end":
|
|
292
295
|
return _context.stop();
|
|
293
296
|
}
|
package/dist/es2019/vc/index.js
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
|
+
var _process;
|
|
1
2
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
2
3
|
import { getConfig } from '../config';
|
|
4
|
+
import { VCObserverNOOP } from './no-op-vc-observer';
|
|
3
5
|
import { VCObserver } from './vc-observer';
|
|
4
6
|
import VCObserverNew from './vc-observer-new';
|
|
5
7
|
class VCObserverWrapper {
|
|
6
8
|
constructor(opts = {}) {
|
|
7
9
|
var _getConfig, _getConfig$vc;
|
|
8
|
-
this.oldVCObserver = new VCObserver(opts);
|
|
9
10
|
this.newVCObserver = null;
|
|
10
11
|
const isNewVCObserverEnabled = fg('platform_ufo_vc_observer_new') || ((_getConfig = getConfig()) === null || _getConfig === void 0 ? void 0 : (_getConfig$vc = _getConfig.vc) === null || _getConfig$vc === void 0 ? void 0 : _getConfig$vc.enableVCObserverNew);
|
|
11
12
|
if (isNewVCObserverEnabled) {
|
|
@@ -13,6 +14,7 @@ class VCObserverWrapper {
|
|
|
13
14
|
selectorConfig: opts.selectorConfig
|
|
14
15
|
});
|
|
15
16
|
}
|
|
17
|
+
this.oldVCObserver = new VCObserver(opts);
|
|
16
18
|
}
|
|
17
19
|
start(startArg) {
|
|
18
20
|
var _this$oldVCObserver, _this$newVCObserver;
|
|
@@ -58,9 +60,28 @@ class VCObserverWrapper {
|
|
|
58
60
|
(_this$oldVCObserver7 = this.oldVCObserver) === null || _this$oldVCObserver7 === void 0 ? void 0 : _this$oldVCObserver7.setReactRootRenderStop(stopTime || performance.now());
|
|
59
61
|
}
|
|
60
62
|
}
|
|
63
|
+
const isServer = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.__SERVER__);
|
|
64
|
+
const isReactSSR = isServer && Boolean(((_process = process) === null || _process === void 0 ? void 0 : _process.env.REACT_SSR) || false);
|
|
65
|
+
function isEnvironmentSupported() {
|
|
66
|
+
// SSR environment aren't supported
|
|
67
|
+
if (isReactSSR) {
|
|
68
|
+
return false;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
// Legacy browsers that doesn't support WeakRef
|
|
72
|
+
// aren't valid
|
|
73
|
+
if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.WeakRef) !== 'function') {
|
|
74
|
+
return false;
|
|
75
|
+
}
|
|
76
|
+
if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.MutationObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.IntersectionObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.PerformanceObserver) !== 'function') {
|
|
77
|
+
return false;
|
|
78
|
+
}
|
|
79
|
+
return true;
|
|
80
|
+
}
|
|
61
81
|
export const getVCObserver = (opts = {}) => {
|
|
62
82
|
if (!globalThis.__vcObserver) {
|
|
63
|
-
|
|
83
|
+
const shouldMockVCObserver = !isEnvironmentSupported();
|
|
84
|
+
globalThis.__vcObserver = shouldMockVCObserver ? new VCObserverNOOP() : new VCObserverWrapper(opts);
|
|
64
85
|
}
|
|
65
86
|
return globalThis.__vcObserver;
|
|
66
87
|
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
// This class should be used on scenarios where VC can not be calculate
|
|
2
|
+
// such as: SSR environment and legacy browsers
|
|
3
|
+
export class VCObserverNOOP {
|
|
4
|
+
start(startArg) {}
|
|
5
|
+
stop() {}
|
|
6
|
+
getVCRawData() {
|
|
7
|
+
return null;
|
|
8
|
+
}
|
|
9
|
+
getVCResult(param) {
|
|
10
|
+
return Promise.resolve({
|
|
11
|
+
'ufo:vc:noop': true
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
setSSRElement(element) {}
|
|
15
|
+
setReactRootRenderStart(startTime) {}
|
|
16
|
+
setReactRootRenderStop(stopTime) {}
|
|
17
|
+
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
3
|
+
import { getPageVisibilityState } from '../../hidden-timing';
|
|
3
4
|
import { attachAbortListeners } from './attachAbortListeners';
|
|
4
5
|
import { getViewportHeight, getViewportWidth } from './getViewport';
|
|
5
6
|
import { MultiRevisionHeatmap } from './heatmap/heatmap';
|
|
@@ -252,29 +253,31 @@ export class VCObserver {
|
|
|
252
253
|
}
|
|
253
254
|
const isVCClean = !abortReasonInfo;
|
|
254
255
|
const isMultiHeatmapEnabled = !fg('platform_ufo_multiheatmap_killswitch');
|
|
256
|
+
const pageVisibilityUpToTTAI = getPageVisibilityState(start, stop);
|
|
257
|
+
const shouldHaveVCmetric = isVCClean && !isEventAborted && pageVisibilityUpToTTAI;
|
|
255
258
|
const revisionsData = isMultiHeatmapEnabled ? fg('platform_ufo_vc_observer_new') ? {
|
|
256
259
|
[`${fullPrefix}vc:rev`]: [{
|
|
257
260
|
revision: 'fy25.01',
|
|
258
261
|
clean: isVCClean,
|
|
259
|
-
'metric:vc90': VC['90'],
|
|
260
|
-
vcDetails: Object.fromEntries(VCObserver.VCParts.map(key => {
|
|
262
|
+
'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
|
|
263
|
+
vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(key => {
|
|
261
264
|
var _VCBox$key;
|
|
262
265
|
return [key, {
|
|
263
266
|
t: VC[key],
|
|
264
267
|
e: (_VCBox$key = VCBox[key]) !== null && _VCBox$key !== void 0 ? _VCBox$key : []
|
|
265
268
|
}];
|
|
266
|
-
}))
|
|
269
|
+
})) : []
|
|
267
270
|
}, {
|
|
268
271
|
revision: 'fy25.02',
|
|
269
272
|
clean: isVCClean,
|
|
270
|
-
'metric:vc90':
|
|
271
|
-
vcDetails: Object.fromEntries(VCObserver.VCParts.map(key => {
|
|
273
|
+
'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
|
|
274
|
+
vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(key => {
|
|
272
275
|
var _vcNext$VCBox$key;
|
|
273
276
|
return [key, {
|
|
274
277
|
t: vcNext.VC[key],
|
|
275
278
|
e: (_vcNext$VCBox$key = vcNext.VCBox[key]) !== null && _vcNext$VCBox$key !== void 0 ? _vcNext$VCBox$key : []
|
|
276
279
|
}];
|
|
277
|
-
}))
|
|
280
|
+
})) : []
|
|
278
281
|
}]
|
|
279
282
|
} : multiHeatmap !== null ? {
|
|
280
283
|
[`${fullPrefix}vc:rev`]: multiHeatmap === null || multiHeatmap === void 0 ? void 0 : multiHeatmap.getPayloadShapedData({
|
package/dist/esm/vc/index.js
CHANGED
|
@@ -3,11 +3,13 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
3
3
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
|
4
4
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
5
5
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
6
|
+
var _process;
|
|
6
7
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
7
8
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
8
9
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
9
10
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
10
11
|
import { getConfig } from '../config';
|
|
12
|
+
import { VCObserverNOOP } from './no-op-vc-observer';
|
|
11
13
|
import { VCObserver } from './vc-observer';
|
|
12
14
|
import VCObserverNew from './vc-observer-new';
|
|
13
15
|
var VCObserverWrapper = /*#__PURE__*/function () {
|
|
@@ -15,7 +17,6 @@ var VCObserverWrapper = /*#__PURE__*/function () {
|
|
|
15
17
|
var _getConfig;
|
|
16
18
|
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
17
19
|
_classCallCheck(this, VCObserverWrapper);
|
|
18
|
-
this.oldVCObserver = new VCObserver(opts);
|
|
19
20
|
this.newVCObserver = null;
|
|
20
21
|
var isNewVCObserverEnabled = fg('platform_ufo_vc_observer_new') || ((_getConfig = getConfig()) === null || _getConfig === void 0 || (_getConfig = _getConfig.vc) === null || _getConfig === void 0 ? void 0 : _getConfig.enableVCObserverNew);
|
|
21
22
|
if (isNewVCObserverEnabled) {
|
|
@@ -23,6 +24,7 @@ var VCObserverWrapper = /*#__PURE__*/function () {
|
|
|
23
24
|
selectorConfig: opts.selectorConfig
|
|
24
25
|
});
|
|
25
26
|
}
|
|
27
|
+
this.oldVCObserver = new VCObserver(opts);
|
|
26
28
|
}
|
|
27
29
|
return _createClass(VCObserverWrapper, [{
|
|
28
30
|
key: "start",
|
|
@@ -106,10 +108,29 @@ var VCObserverWrapper = /*#__PURE__*/function () {
|
|
|
106
108
|
}
|
|
107
109
|
}]);
|
|
108
110
|
}();
|
|
111
|
+
var isServer = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.__SERVER__);
|
|
112
|
+
var isReactSSR = isServer && Boolean(((_process = process) === null || _process === void 0 ? void 0 : _process.env.REACT_SSR) || false);
|
|
113
|
+
function isEnvironmentSupported() {
|
|
114
|
+
// SSR environment aren't supported
|
|
115
|
+
if (isReactSSR) {
|
|
116
|
+
return false;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
// Legacy browsers that doesn't support WeakRef
|
|
120
|
+
// aren't valid
|
|
121
|
+
if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.WeakRef) !== 'function') {
|
|
122
|
+
return false;
|
|
123
|
+
}
|
|
124
|
+
if (typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.MutationObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.IntersectionObserver) !== 'function' || typeof (globalThis === null || globalThis === void 0 ? void 0 : globalThis.PerformanceObserver) !== 'function') {
|
|
125
|
+
return false;
|
|
126
|
+
}
|
|
127
|
+
return true;
|
|
128
|
+
}
|
|
109
129
|
export var getVCObserver = function getVCObserver() {
|
|
110
130
|
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
111
131
|
if (!globalThis.__vcObserver) {
|
|
112
|
-
|
|
132
|
+
var shouldMockVCObserver = !isEnvironmentSupported();
|
|
133
|
+
globalThis.__vcObserver = shouldMockVCObserver ? new VCObserverNOOP() : new VCObserverWrapper(opts);
|
|
113
134
|
}
|
|
114
135
|
return globalThis.__vcObserver;
|
|
115
136
|
};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
2
|
+
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
|
+
// This class should be used on scenarios where VC can not be calculate
|
|
4
|
+
// such as: SSR environment and legacy browsers
|
|
5
|
+
export var VCObserverNOOP = /*#__PURE__*/function () {
|
|
6
|
+
function VCObserverNOOP() {
|
|
7
|
+
_classCallCheck(this, VCObserverNOOP);
|
|
8
|
+
}
|
|
9
|
+
return _createClass(VCObserverNOOP, [{
|
|
10
|
+
key: "start",
|
|
11
|
+
value: function start(startArg) {}
|
|
12
|
+
}, {
|
|
13
|
+
key: "stop",
|
|
14
|
+
value: function stop() {}
|
|
15
|
+
}, {
|
|
16
|
+
key: "getVCRawData",
|
|
17
|
+
value: function getVCRawData() {
|
|
18
|
+
return null;
|
|
19
|
+
}
|
|
20
|
+
}, {
|
|
21
|
+
key: "getVCResult",
|
|
22
|
+
value: function getVCResult(param) {
|
|
23
|
+
return Promise.resolve({
|
|
24
|
+
'ufo:vc:noop': true
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
}, {
|
|
28
|
+
key: "setSSRElement",
|
|
29
|
+
value: function setSSRElement(element) {}
|
|
30
|
+
}, {
|
|
31
|
+
key: "setReactRootRenderStart",
|
|
32
|
+
value: function setReactRootRenderStart(startTime) {}
|
|
33
|
+
}, {
|
|
34
|
+
key: "setReactRootRenderStop",
|
|
35
|
+
value: function setReactRootRenderStop(stopTime) {}
|
|
36
|
+
}]);
|
|
37
|
+
}();
|
|
@@ -10,6 +10,7 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
|
10
10
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
11
11
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
12
12
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
+
import { getPageVisibilityState } from '../../hidden-timing';
|
|
13
14
|
import { attachAbortListeners } from './attachAbortListeners';
|
|
14
15
|
import { getViewportHeight, getViewportWidth } from './getViewport';
|
|
15
16
|
import { MultiRevisionHeatmap } from './heatmap/heatmap';
|
|
@@ -96,7 +97,7 @@ export var VCObserver = /*#__PURE__*/function () {
|
|
|
96
97
|
});
|
|
97
98
|
_defineProperty(this, "getVCResult", /*#__PURE__*/function () {
|
|
98
99
|
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref3) {
|
|
99
|
-
var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
|
|
100
|
+
var start, stop, tti, prefix, ssr, vc, isEventAborted, startTime, fullPrefix, rawData, abortReason, abortReasonInfo, heatmap, heatmapNext, outOfBoundaryInfo, totalTime, componentsLog, viewport, devToolsEnabled, ratios, multiHeatmap, _VCObserver$calculate, VC, VCBox, VCEntries, totalPainted, _componentsLog, vcNext, outOfBoundary, stopTime, isVCClean, isMultiHeatmapEnabled, pageVisibilityUpToTTAI, shouldHaveVCmetric, revisionsData, isCalcSpeedIndexEnabled, speedIndex;
|
|
100
101
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
101
102
|
while (1) switch (_context.prev = _context.next) {
|
|
102
103
|
case 0:
|
|
@@ -235,28 +236,30 @@ export var VCObserver = /*#__PURE__*/function () {
|
|
|
235
236
|
}
|
|
236
237
|
isVCClean = !abortReasonInfo;
|
|
237
238
|
isMultiHeatmapEnabled = !fg('platform_ufo_multiheatmap_killswitch');
|
|
239
|
+
pageVisibilityUpToTTAI = getPageVisibilityState(start, stop);
|
|
240
|
+
shouldHaveVCmetric = isVCClean && !isEventAborted && pageVisibilityUpToTTAI;
|
|
238
241
|
revisionsData = isMultiHeatmapEnabled ? fg('platform_ufo_vc_observer_new') ? _defineProperty({}, "".concat(fullPrefix, "vc:rev"), [{
|
|
239
242
|
revision: 'fy25.01',
|
|
240
243
|
clean: isVCClean,
|
|
241
|
-
'metric:vc90': VC['90'],
|
|
242
|
-
vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
244
|
+
'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
|
|
245
|
+
vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
243
246
|
var _VCBox$key;
|
|
244
247
|
return [key, {
|
|
245
248
|
t: VC[key],
|
|
246
249
|
e: (_VCBox$key = VCBox[key]) !== null && _VCBox$key !== void 0 ? _VCBox$key : []
|
|
247
250
|
}];
|
|
248
|
-
}))
|
|
251
|
+
})) : []
|
|
249
252
|
}, {
|
|
250
253
|
revision: 'fy25.02',
|
|
251
254
|
clean: isVCClean,
|
|
252
|
-
'metric:vc90':
|
|
253
|
-
vcDetails: Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
255
|
+
'metric:vc90': shouldHaveVCmetric ? VC['90'] : null,
|
|
256
|
+
vcDetails: shouldHaveVCmetric ? Object.fromEntries(VCObserver.VCParts.map(function (key) {
|
|
254
257
|
var _vcNext$VCBox$key;
|
|
255
258
|
return [key, {
|
|
256
259
|
t: vcNext.VC[key],
|
|
257
260
|
e: (_vcNext$VCBox$key = vcNext.VCBox[key]) !== null && _vcNext$VCBox$key !== void 0 ? _vcNext$VCBox$key : []
|
|
258
261
|
}];
|
|
259
|
-
}))
|
|
262
|
+
})) : []
|
|
260
263
|
}]) : multiHeatmap !== null ? _defineProperty({}, "".concat(fullPrefix, "vc:rev"), multiHeatmap === null || multiHeatmap === void 0 ? void 0 : multiHeatmap.getPayloadShapedData({
|
|
261
264
|
VCParts: VCObserver.VCParts.map(function (v) {
|
|
262
265
|
return parseInt(v);
|
|
@@ -280,7 +283,7 @@ export var VCObserver = /*#__PURE__*/function () {
|
|
|
280
283
|
return _context.abrupt("return", _objectSpread(_objectSpread(_objectSpread(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
|
|
281
284
|
'metrics:vc': VC
|
|
282
285
|
}, "".concat(fullPrefix, "vc:state"), true), "".concat(fullPrefix, "vc:clean"), isVCClean), "".concat(fullPrefix, "vc:dom"), VCBox), "".concat(fullPrefix, "vc:updates"), VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:size"), viewport), "".concat(fullPrefix, "vc:time"), Math.round(totalTime + (stopTime - startTime))), "".concat(fullPrefix, "vc:total"), totalPainted), "".concat(fullPrefix, "vc:ratios"), ratios), outOfBoundary), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(fullPrefix, "vc:next"), vcNext.VC), "".concat(fullPrefix, "vc:next:updates"), vcNext.VCEntries.rel.slice(0, 50)), "".concat(fullPrefix, "vc:next:dom"), vcNext.VCBox), "".concat(fullPrefix, "vc:ignored"), _this.getIgnoredElements(componentsLog)), revisionsData), isCalcSpeedIndexEnabled ? speedIndex : {}));
|
|
283
|
-
case
|
|
286
|
+
case 27:
|
|
284
287
|
case "end":
|
|
285
288
|
return _context.stop();
|
|
286
289
|
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { VCResult } from '../common/vc/types';
|
|
2
|
+
import type { GetVCResultType, VCObserverInterface } from './types';
|
|
3
|
+
export declare class VCObserverNOOP implements VCObserverInterface {
|
|
4
|
+
start(startArg: {
|
|
5
|
+
startTime: number;
|
|
6
|
+
}): void;
|
|
7
|
+
stop(): void;
|
|
8
|
+
getVCRawData(): null;
|
|
9
|
+
getVCResult(param: GetVCResultType): Promise<VCResult>;
|
|
10
|
+
setSSRElement(element: HTMLElement): void;
|
|
11
|
+
setReactRootRenderStart(startTime: number): void;
|
|
12
|
+
setReactRootRenderStop(stopTime: number): void;
|
|
13
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { VCResult } from '../common/vc/types';
|
|
2
|
+
import type { GetVCResultType, VCObserverInterface } from './types';
|
|
3
|
+
export declare class VCObserverNOOP implements VCObserverInterface {
|
|
4
|
+
start(startArg: {
|
|
5
|
+
startTime: number;
|
|
6
|
+
}): void;
|
|
7
|
+
stop(): void;
|
|
8
|
+
getVCRawData(): null;
|
|
9
|
+
getVCResult(param: GetVCResultType): Promise<VCResult>;
|
|
10
|
+
setSSRElement(element: HTMLElement): void;
|
|
11
|
+
setReactRootRenderStart(startTime: number): void;
|
|
12
|
+
setReactRootRenderStop(stopTime: number): void;
|
|
13
|
+
}
|