@atlaskit/react-ufo 3.11.2 → 3.12.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 3.12.0
+
+### Minor Changes
+
+- [#155304](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/155304)
+  [`8208673d5be30`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8208673d5be30) -
+  add CPU usage metrics as part of UFO payload
+
 ## 3.11.2
 
 ### Patch Changes

package/dist/cjs/create-payload/index.js

@@ -14,6 +14,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _bowserUltralight = _interopRequireDefault(require("bowser-ultralight"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _additionalPayload = require("../additional-payload");
 var _assets = require("../assets");
 var bundleEvalTiming = _interopRequireWildcard(require("../bundle-eval-timing"));
@@ -25,6 +26,7 @@ var _globalErrorHandler = require("../global-error-handler");
 var _hiddenTiming = require("../hidden-timing");
 var initialPageLoadExtraTiming = _interopRequireWildcard(require("../initial-page-load-extra-timing"));
 var _interactionMetrics = require("../interaction-metrics");
+var _machineUtilisation = require("../machine-utilisation");
 var resourceTiming = _interopRequireWildcard(require("../resource-timing"));
 var _resourceTimingBuffer = require("../resource-timing/common/utils/resource-timing-buffer");
 var _roundNumber = require("../round-number");
@@ -800,7 +802,7 @@ function _createInteractionMetricsPayload() {
             source: 'measured',
             tags: ['observability'],
             attributes: {
-              properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
+              properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
                 // basic
                 'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
                 'event:product': config.product,
@@ -813,7 +815,9 @@ function _createInteractionMetricsPayload() {
                 'event:region': config.region || 'unknown',
                 'experience:key': experimental ? 'custom.experimental-interaction-metrics' : 'custom.interaction-metrics',
                 'experience:name': newUFOName
-              }, getBrowserMetadata()), getSSRProperties(type)), getAssetsMetrics(interaction, pageLoadInteractionMetrics === null || pageLoadInteractionMetrics === void 0 ? void 0 : pageLoadInteractionMetrics.SSRDoneTime)), getPPSMetrics(interaction)), paintMetrics), getNavigationMetrics(type)), vcMetrics), experimentalMetrics), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
+              }, (0, _platformFeatureFlags.fg)('platform_ufo_report_cpu_usage') ? {
+                'event:cpu:usage': (0, _machineUtilisation.createPressureStateReport)(interaction.start, interaction.end)
+              } : {}), getBrowserMetadata()), getSSRProperties(type)), getAssetsMetrics(interaction, pageLoadInteractionMetrics === null || pageLoadInteractionMetrics === void 0 ? void 0 : pageLoadInteractionMetrics.SSRDoneTime)), getPPSMetrics(interaction)), paintMetrics), getNavigationMetrics(type)), vcMetrics), experimentalMetrics), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
                 interactionMetrics: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
                   namePrefix: config.namePrefix || '',
                   segmentPrefix: config.segmentPrefix || '',

package/dist/cjs/interaction-metrics-init/index.js

@@ -14,6 +14,7 @@ var _createExperimentalInteractionMetricsPayload = require("../create-experiment
 var _hiddenTiming = require("../hidden-timing");
 var _interactionMetrics = require("../interaction-metrics");
 var _interactionsPerformanceObserver = require("../interactions-performance-observer");
+var _machineUtilisation = require("../machine-utilisation");
 var _vc = require("../vc");
 var _scheduleIdleCallback = _interopRequireDefault(require("./schedule-idle-callback"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -84,6 +85,9 @@ function init(analyticsWebClientAsync, config) {
   if (initialized) {
     return;
   }
+  if ((0, _platformFeatureFlags.fg)('platform_ufo_report_cpu_usage')) {
+    (0, _machineUtilisation.initialisePressureObserver)();
+  }
   (0, _config.setUFOConfig)(config);
   if ((_config$vc = config.vc) !== null && _config$vc !== void 0 && _config$vc.enabled) {
     var _config$experimentalI;

package/dist/cjs/machine-utilisation/index.js

@@ -0,0 +1,77 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createPressureStateReport = createPressureStateReport;
+exports.disconnectPressureObserver = disconnectPressureObserver;
+exports.initialisePressureObserver = initialisePressureObserver;
+exports.removeOldBufferRecords = removeOldBufferRecords;
+exports.resetPressureRecordBuffer = resetPressureRecordBuffer;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var BUFFER_MAX_LENGTH = 1000; // ensure we don't blow up this buffer
+var pressureRecordBuffer = [];
+var pressureObserver = null;
+function resetPressureRecordBuffer() {
+  pressureRecordBuffer.length = 0;
+}
+function removeOldBufferRecords(filter) {
+  pressureRecordBuffer = pressureRecordBuffer.filter(function (_ref) {
+    var time = _ref.time;
+    return time > filter;
+  });
+}
+function createPressureStateReport(start, end) {
+  // To differentiate between the API not available, vs no PressureRecords added
+  if (!('PressureObserver' in globalThis)) {
+    return null;
+  }
+  var pressureStateCount = pressureRecordBuffer.reduce(function (pressureReport, _ref2) {
+    var time = _ref2.time,
+      state = _ref2.state;
+    if (time >= start && time <= end) {
+      pressureReport[state] += 1;
+    }
+    return pressureReport;
+  }, {
+    nominal: 0,
+    fair: 0,
+    serious: 0,
+    critical: 0
+  });
+  var pressureStateTotal = Object.values(pressureStateCount).reduce(function (total, count) {
+    return total + count;
+  }) || 1;
+  removeOldBufferRecords(end);
+  return {
+    count: pressureStateCount,
+    percentage: {
+      nominal: Math.round(pressureStateCount.nominal / pressureStateTotal * 100),
+      fair: Math.round(pressureStateCount.fair / pressureStateTotal * 100),
+      serious: Math.round(pressureStateCount.serious / pressureStateTotal * 100),
+      critical: Math.round(pressureStateCount.critical / pressureStateTotal * 100)
+    }
+  };
+}
+function initialisePressureObserver() {
+  try {
+    if ('PressureObserver' in globalThis) {
+      pressureObserver = new PressureObserver(function (records) {
+        if (pressureRecordBuffer.length + records.length <= BUFFER_MAX_LENGTH) {
+          var _pressureRecordBuffer;
+          (_pressureRecordBuffer = pressureRecordBuffer).push.apply(_pressureRecordBuffer, (0, _toConsumableArray2.default)(records));
+        }
+      });
+      pressureObserver.observe('cpu', {
+        sampleInterval: 100
+      });
+    }
+  } catch (err) {
+    /* do nothing, this is a best efforts metric */
+  }
+}
+function disconnectPressureObserver() {
+  var _pressureObserver;
+  (_pressureObserver = pressureObserver) === null || _pressureObserver === void 0 || _pressureObserver.disconnect();
+}

package/dist/cjs/machine-utilisation/types.js

@@ -0,0 +1 @@
+"use strict";

package/dist/es2019/create-payload/index.js

@@ -1,4 +1,5 @@
 import Bowser from 'bowser-ultralight';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { getLighthouseMetrics } from '../additional-payload';
 import { CHRReporter } from '../assets';
 import * as bundleEvalTiming from '../bundle-eval-timing';
@@ -10,6 +11,7 @@ import { getGlobalErrorCount } from '../global-error-handler';
 import { getPageVisibilityState } from '../hidden-timing';
 import * as initialPageLoadExtraTiming from '../initial-page-load-extra-timing';
 import { interactionSpans as atlaskitInteractionSpans } from '../interaction-metrics';
+import { createPressureStateReport } from '../machine-utilisation';
 import * as resourceTiming from '../resource-timing';
 import { filterResourceTimings } from '../resource-timing/common/utils/resource-timing-buffer';
 import { roundEpsilon } from '../round-number';
@@ -786,6 +788,9 @@ async function createInteractionMetricsPayload(interaction, interactionId, exper
         'event:region': config.region || 'unknown',
         'experience:key': experimental ? 'custom.experimental-interaction-metrics' : 'custom.interaction-metrics',
         'experience:name': newUFOName,
+        ...(fg('platform_ufo_report_cpu_usage') ? {
+          'event:cpu:usage': createPressureStateReport(interaction.start, interaction.end)
+        } : {}),
         // root
         ...getBrowserMetadata(),
         ...getSSRProperties(type),

package/dist/es2019/interaction-metrics-init/index.js

@@ -5,6 +5,7 @@ import { experimentalVC, sinkExperimentalHandler } from '../create-experimental-
 import { setupHiddenTimingCapture } from '../hidden-timing';
 import { postInteractionLog, sinkInteractionHandler, sinkPostInteractionLogHandler } from '../interaction-metrics';
 import { getPerformanceObserver } from '../interactions-performance-observer';
+import { initialisePressureObserver } from '../machine-utilisation';
 import { getVCObserver } from '../vc';
 import scheduleIdleCallback from './schedule-idle-callback';
 let initialized = false;
@@ -73,6 +74,9 @@ export function init(analyticsWebClientAsync, config) {
   if (initialized) {
     return;
   }
+  if (fg('platform_ufo_report_cpu_usage')) {
+    initialisePressureObserver();
+  }
   setUFOConfig(config);
   if ((_config$vc = config.vc) !== null && _config$vc !== void 0 && _config$vc.enabled) {
     var _config$experimentalI;

package/dist/es2019/machine-utilisation/index.js

@@ -0,0 +1,62 @@
+const BUFFER_MAX_LENGTH = 1000; // ensure we don't blow up this buffer
+let pressureRecordBuffer = [];
+let pressureObserver = null;
+export function resetPressureRecordBuffer() {
+  pressureRecordBuffer.length = 0;
+}
+export function removeOldBufferRecords(filter) {
+  pressureRecordBuffer = pressureRecordBuffer.filter(({
+    time
+  }) => time > filter);
+}
+export function createPressureStateReport(start, end) {
+  // To differentiate between the API not available, vs no PressureRecords added
+  if (!('PressureObserver' in globalThis)) {
+    return null;
+  }
+  const pressureStateCount = pressureRecordBuffer.reduce((pressureReport, {
+    time,
+    state
+  }) => {
+    if (time >= start && time <= end) {
+      pressureReport[state] += 1;
+    }
+    return pressureReport;
+  }, {
+    nominal: 0,
+    fair: 0,
+    serious: 0,
+    critical: 0
+  });
+  const pressureStateTotal = Object.values(pressureStateCount).reduce((total, count) => total + count) || 1;
+  removeOldBufferRecords(end);
+  return {
+    count: pressureStateCount,
+    percentage: {
+      nominal: Math.round(pressureStateCount.nominal / pressureStateTotal * 100),
+      fair: Math.round(pressureStateCount.fair / pressureStateTotal * 100),
+      serious: Math.round(pressureStateCount.serious / pressureStateTotal * 100),
+      critical: Math.round(pressureStateCount.critical / pressureStateTotal * 100)
+    }
+  };
+}
+export function initialisePressureObserver() {
+  try {
+    if ('PressureObserver' in globalThis) {
+      pressureObserver = new PressureObserver(records => {
+        if (pressureRecordBuffer.length + records.length <= BUFFER_MAX_LENGTH) {
+          pressureRecordBuffer.push(...records);
+        }
+      });
+      pressureObserver.observe('cpu', {
+        sampleInterval: 100
+      });
+    }
+  } catch (err) {
+    /* do nothing, this is a best efforts metric */
+  }
+}
+export function disconnectPressureObserver() {
+  var _pressureObserver;
+  (_pressureObserver = pressureObserver) === null || _pressureObserver === void 0 ? void 0 : _pressureObserver.disconnect();
+}

package/dist/esm/create-payload/index.js

@@ -11,6 +11,7 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 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; }
 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; }
 import Bowser from 'bowser-ultralight';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { getLighthouseMetrics } from '../additional-payload';
 import { CHRReporter } from '../assets';
 import * as bundleEvalTiming from '../bundle-eval-timing';
@@ -22,6 +23,7 @@ import { getGlobalErrorCount } from '../global-error-handler';
 import { getPageVisibilityState } from '../hidden-timing';
 import * as initialPageLoadExtraTiming from '../initial-page-load-extra-timing';
 import { interactionSpans as atlaskitInteractionSpans } from '../interaction-metrics';
+import { createPressureStateReport } from '../machine-utilisation';
 import * as resourceTiming from '../resource-timing';
 import { filterResourceTimings } from '../resource-timing/common/utils/resource-timing-buffer';
 import { roundEpsilon } from '../round-number';
@@ -789,7 +791,7 @@ function _createInteractionMetricsPayload() {
             source: 'measured',
             tags: ['observability'],
             attributes: {
-              properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
+              properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
                 // basic
                 'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
                 'event:product': config.product,
@@ -802,7 +804,9 @@ function _createInteractionMetricsPayload() {
                 'event:region': config.region || 'unknown',
                 'experience:key': experimental ? 'custom.experimental-interaction-metrics' : 'custom.interaction-metrics',
                 'experience:name': newUFOName
-              }, getBrowserMetadata()), getSSRProperties(type)), getAssetsMetrics(interaction, pageLoadInteractionMetrics === null || pageLoadInteractionMetrics === void 0 ? void 0 : pageLoadInteractionMetrics.SSRDoneTime)), getPPSMetrics(interaction)), paintMetrics), getNavigationMetrics(type)), vcMetrics), experimentalMetrics), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
+              }, fg('platform_ufo_report_cpu_usage') ? {
+                'event:cpu:usage': createPressureStateReport(interaction.start, interaction.end)
+              } : {}), getBrowserMetadata()), getSSRProperties(type)), getAssetsMetrics(interaction, pageLoadInteractionMetrics === null || pageLoadInteractionMetrics === void 0 ? void 0 : pageLoadInteractionMetrics.SSRDoneTime)), getPPSMetrics(interaction)), paintMetrics), getNavigationMetrics(type)), vcMetrics), experimentalMetrics), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
                 interactionMetrics: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
                   namePrefix: config.namePrefix || '',
                   segmentPrefix: config.segmentPrefix || '',

package/dist/esm/interaction-metrics-init/index.js

@@ -6,6 +6,7 @@ import { experimentalVC, sinkExperimentalHandler } from '../create-experimental-
 import { setupHiddenTimingCapture } from '../hidden-timing';
 import { postInteractionLog, sinkInteractionHandler, sinkPostInteractionLogHandler } from '../interaction-metrics';
 import { getPerformanceObserver } from '../interactions-performance-observer';
+import { initialisePressureObserver } from '../machine-utilisation';
 import { getVCObserver } from '../vc';
 import scheduleIdleCallback from './schedule-idle-callback';
 var initialized = false;
@@ -74,6 +75,9 @@ export function init(analyticsWebClientAsync, config) {
   if (initialized) {
     return;
   }
+  if (fg('platform_ufo_report_cpu_usage')) {
+    initialisePressureObserver();
+  }
   setUFOConfig(config);
   if ((_config$vc = config.vc) !== null && _config$vc !== void 0 && _config$vc.enabled) {
     var _config$experimentalI;

package/dist/esm/machine-utilisation/index.js

@@ -0,0 +1,66 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+var BUFFER_MAX_LENGTH = 1000; // ensure we don't blow up this buffer
+var pressureRecordBuffer = [];
+var pressureObserver = null;
+export function resetPressureRecordBuffer() {
+  pressureRecordBuffer.length = 0;
+}
+export function removeOldBufferRecords(filter) {
+  pressureRecordBuffer = pressureRecordBuffer.filter(function (_ref) {
+    var time = _ref.time;
+    return time > filter;
+  });
+}
+export function createPressureStateReport(start, end) {
+  // To differentiate between the API not available, vs no PressureRecords added
+  if (!('PressureObserver' in globalThis)) {
+    return null;
+  }
+  var pressureStateCount = pressureRecordBuffer.reduce(function (pressureReport, _ref2) {
+    var time = _ref2.time,
+      state = _ref2.state;
+    if (time >= start && time <= end) {
+      pressureReport[state] += 1;
+    }
+    return pressureReport;
+  }, {
+    nominal: 0,
+    fair: 0,
+    serious: 0,
+    critical: 0
+  });
+  var pressureStateTotal = Object.values(pressureStateCount).reduce(function (total, count) {
+    return total + count;
+  }) || 1;
+  removeOldBufferRecords(end);
+  return {
+    count: pressureStateCount,
+    percentage: {
+      nominal: Math.round(pressureStateCount.nominal / pressureStateTotal * 100),
+      fair: Math.round(pressureStateCount.fair / pressureStateTotal * 100),
+      serious: Math.round(pressureStateCount.serious / pressureStateTotal * 100),
+      critical: Math.round(pressureStateCount.critical / pressureStateTotal * 100)
+    }
+  };
+}
+export function initialisePressureObserver() {
+  try {
+    if ('PressureObserver' in globalThis) {
+      pressureObserver = new PressureObserver(function (records) {
+        if (pressureRecordBuffer.length + records.length <= BUFFER_MAX_LENGTH) {
+          var _pressureRecordBuffer;
+          (_pressureRecordBuffer = pressureRecordBuffer).push.apply(_pressureRecordBuffer, _toConsumableArray(records));
+        }
+      });
+      pressureObserver.observe('cpu', {
+        sampleInterval: 100
+      });
+    }
+  } catch (err) {
+    /* do nothing, this is a best efforts metric */
+  }
+}
+export function disconnectPressureObserver() {
+  var _pressureObserver;
+  (_pressureObserver = pressureObserver) === null || _pressureObserver === void 0 || _pressureObserver.disconnect();
+}