@atlaskit/react-ufo 3.14.14 → 4.0.0

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.
Files changed (47) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/config/index.js +14 -48
  3. package/dist/cjs/create-payload/index.js +17 -11
  4. package/dist/cjs/create-post-interaction-log-payload/get-late-mutations.js +1 -1
  5. package/dist/cjs/create-post-interaction-log-payload/index.js +2 -2
  6. package/dist/cjs/interaction-metrics/post-interaction-log.js +0 -1
  7. package/dist/cjs/interaction-metrics-init/index.js +1 -3
  8. package/dist/cjs/placeholder/Placeholder.js +3 -3
  9. package/dist/cjs/suspense/Suspense.js +20 -0
  10. package/dist/cjs/suspense/index.js +9 -0
  11. package/dist/cjs/vc/vc-observer-new/metric-calculator/fy25_03/index.js +1 -1
  12. package/dist/es2019/config/index.js +5 -39
  13. package/dist/es2019/create-payload/index.js +16 -12
  14. package/dist/es2019/create-post-interaction-log-payload/get-late-mutations.js +1 -1
  15. package/dist/es2019/create-post-interaction-log-payload/index.js +3 -3
  16. package/dist/es2019/interaction-metrics/post-interaction-log.js +0 -1
  17. package/dist/es2019/interaction-metrics-init/index.js +1 -3
  18. package/dist/es2019/placeholder/Placeholder.js +3 -3
  19. package/dist/es2019/suspense/Suspense.js +14 -0
  20. package/dist/es2019/suspense/index.js +2 -0
  21. package/dist/es2019/vc/vc-observer-new/metric-calculator/fy25_03/index.js +1 -1
  22. package/dist/esm/config/index.js +13 -45
  23. package/dist/esm/create-payload/index.js +17 -11
  24. package/dist/esm/create-post-interaction-log-payload/get-late-mutations.js +1 -1
  25. package/dist/esm/create-post-interaction-log-payload/index.js +3 -3
  26. package/dist/esm/interaction-metrics/post-interaction-log.js +0 -1
  27. package/dist/esm/interaction-metrics-init/index.js +1 -3
  28. package/dist/esm/placeholder/Placeholder.js +3 -3
  29. package/dist/esm/suspense/Suspense.js +13 -0
  30. package/dist/esm/suspense/index.js +2 -0
  31. package/dist/esm/vc/vc-observer-new/metric-calculator/fy25_03/index.js +1 -1
  32. package/dist/types/common/assets/types.d.ts +1 -1
  33. package/dist/types/config/index.d.ts +16 -17
  34. package/dist/types/create-payload/index.d.ts +64 -64
  35. package/dist/types/create-post-interaction-log-payload/get-late-mutations.d.ts +1 -1
  36. package/dist/types/placeholder/Placeholder.d.ts +3 -3
  37. package/dist/types/suspense/Suspense.d.ts +7 -0
  38. package/dist/types/suspense/index.d.ts +2 -0
  39. package/dist/types-ts4.5/common/assets/types.d.ts +1 -1
  40. package/dist/types-ts4.5/config/index.d.ts +16 -17
  41. package/dist/types-ts4.5/create-payload/index.d.ts +64 -64
  42. package/dist/types-ts4.5/create-post-interaction-log-payload/get-late-mutations.d.ts +1 -1
  43. package/dist/types-ts4.5/placeholder/Placeholder.d.ts +3 -3
  44. package/dist/types-ts4.5/suspense/Suspense.d.ts +7 -0
  45. package/dist/types-ts4.5/suspense/index.d.ts +2 -0
  46. package/package.json +5 -4
  47. package/suspense/package.json +15 -0
@@ -175,13 +175,19 @@ function getPPSMetrics(interaction) {
175
175
  start: start,
176
176
  stop: interaction.end
177
177
  }) : null;
178
- if (config !== null && config !== void 0 && config.shouldCalculateLighthouseMetricsFromTTAI && PPSMetricsAtTTAI !== null) {
179
- return PPSMetricsAtTTAI;
180
- }
181
- if (PPSMetricsAtTTI !== null) {
182
- return _objectSpread(_objectSpread({}, PPSMetricsAtTTI), {}, {
183
- 'metrics@ttai': PPSMetricsAtTTAI
184
- });
178
+ if (fg('platform_ufo_remove_deprecated_config_fields')) {
179
+ if (PPSMetricsAtTTAI !== null) {
180
+ return PPSMetricsAtTTAI;
181
+ }
182
+ } else {
183
+ if (config !== null && config !== void 0 && config.shouldCalculateLighthouseMetricsFromTTAI && PPSMetricsAtTTAI !== null) {
184
+ return PPSMetricsAtTTAI;
185
+ }
186
+ if (PPSMetricsAtTTI !== null) {
187
+ return _objectSpread(_objectSpread({}, PPSMetricsAtTTI), {}, {
188
+ 'metrics@ttai': PPSMetricsAtTTAI
189
+ });
190
+ }
185
191
  }
186
192
  return {};
187
193
  }
@@ -584,7 +590,7 @@ function _createInteractionMetricsPayload() {
584
590
  end = interaction.end, start = interaction.start, ufoName = interaction.ufoName, knownSegments = interaction.knownSegments, rate = interaction.rate, type = interaction.type, abortReason = interaction.abortReason, routeName = interaction.routeName, featureFlags = interaction.featureFlags, previousInteractionName = interaction.previousInteractionName, isPreviousInteractionAborted = interaction.isPreviousInteractionAborted, abortedByInteractionName = interaction.abortedByInteractionName, responsiveness = interaction.responsiveness, unknownElementName = interaction.unknownElementName, unknownElementHierarchy = interaction.unknownElementHierarchy;
585
591
  pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
586
592
  pageVisibilityAtTTAI = getPageVisibilityUpToTTAI(interaction);
587
- segments = config.killswitchNestedSegments ? [] : knownSegments;
593
+ segments = !fg('platform_ufo_remove_deprecated_config_fields') && config.killswitchNestedSegments ? [] : knownSegments;
588
594
  segmentTree = getReactUFOPayloadVersion(interaction.type) === '2.0.0' ? buildSegmentTree(segments.map(function (segment) {
589
595
  return segment.labelStack;
590
596
  })) : {};
@@ -684,7 +690,7 @@ function _createInteractionMetricsPayload() {
684
690
  source: 'measured',
685
691
  tags: ['observability'],
686
692
  attributes: {
687
- properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
693
+ properties: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
688
694
  // basic
689
695
  'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
690
696
  'event:product': config.product,
@@ -699,9 +705,9 @@ function _createInteractionMetricsPayload() {
699
705
  'experience:name': newUFOName
700
706
  }, fg('platform_ufo_report_cpu_usage') ? {
701
707
  'event:cpu:usage': createPressureStateReport(interaction.start, interaction.end)
702
- } : {}), fg('platform_ufo_report_memory_usage') ? {
708
+ } : {}), {}, {
703
709
  'event:memory:usage': createMemoryStateReport(interaction.start, interaction.end)
704
- } : {}), criticalPayloadCount !== undefined ? {
710
+ }, criticalPayloadCount !== undefined ? {
705
711
  'ufo:multipayload': true,
706
712
  'ufo:criticalPayloadCount': criticalPayloadCount
707
713
  } : {}), getBrowserMetadataToLegacyFormat()), getSSRProperties(type)), getAssetsMetrics(interaction, pageLoadInteractionMetrics === null || pageLoadInteractionMetrics === void 0 ? void 0 : pageLoadInteractionMetrics.SSRDoneTime)), getPPSMetrics(interaction)), paintMetrics), getNavigationMetricsToLegacyFormat(type)), finalVCMetrics), experimentalMetrics), (_config$additionalPay = config.additionalPayloadData) === null || _config$additionalPay === void 0 ? void 0 : _config$additionalPay.call(config, interaction)), getTracingContextData(interaction)), getStylesheetMetrics()), getErrorCounts(interaction)), {}, {
@@ -26,7 +26,7 @@ function getLateMutations(vcDetails, lastInteractionFinish, postInteractionFinis
26
26
  result.push({
27
27
  time: details.t,
28
28
  element: element,
29
- viewportHeatmapPercentage: postInteractionFinishVCRatios[element] || 0
29
+ viewportHeatmapPercentage: (postInteractionFinishVCRatios === null || postInteractionFinishVCRatios === void 0 ? void 0 : postInteractionFinishVCRatios[element]) || 0
30
30
  });
31
31
  }
32
32
  } catch (err) {
@@ -4,7 +4,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
4
4
  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; }
5
5
  import { fg } from '@atlaskit/platform-feature-flags';
6
6
  import coinflip from '../coinflip';
7
- import { getConfig, getMostRecentVCRevision, getPostInteractionRate } from '../config';
7
+ import { DEFAULT_TTVC_REVISION, getConfig, getMostRecentVCRevision, getPostInteractionRate } from '../config';
8
8
  import { isSegmentLabel, sanitizeUfoName } from '../create-payload/common/utils';
9
9
  import { getReactUFOPayloadVersion } from '../create-payload/utils/get-react-ufo-payload-version';
10
10
  import { getPageVisibilityState } from '../hidden-timing';
@@ -147,7 +147,7 @@ function createPostInteractionLogPayload(_ref2) {
147
147
  var lastInteractionFinishStart = Math.round(lastInteractionFinish.start);
148
148
  var lastInteractionFinishEnd = Math.round(lastInteractionFinish.end);
149
149
  var lastInteractionFinishTTAI = Math.round(lastInteractionFinish.end - lastInteractionFinish.start);
150
- var mostRecentVCRevision = fg('platform_ufo_post_interaction_most_recent_vc_rev') ? getMostRecentVCRevision(lastInteractionFinish.ufoName) : 'fy25.02';
150
+ var mostRecentVCRevision = fg('platform_ufo_post_interaction_most_recent_vc_rev') ? getMostRecentVCRevision(lastInteractionFinish.ufoName) : DEFAULT_TTVC_REVISION;
151
151
  var lastInteractionFinishVC90 = null;
152
152
  var lastInteractionFinishVCClean = false;
153
153
  var lastInteractionFinishVCRev = lastInteractionFinishVCResult === null || lastInteractionFinishVCResult === void 0 ? void 0 : lastInteractionFinishVCResult['ufo:vc:rev'];
@@ -171,7 +171,7 @@ function createPostInteractionLogPayload(_ref2) {
171
171
  });
172
172
  if (postInteractionFinishRevision !== null && postInteractionFinishRevision !== void 0 && postInteractionFinishRevision.clean) {
173
173
  postInteractionFinishVCClean = true;
174
- postInteractionFinishVCRatios = postInteractionFinishVCResult === null || postInteractionFinishVCResult === void 0 ? void 0 : postInteractionFinishVCResult['ufo:vc:ratios'];
174
+ postInteractionFinishVCRatios = postInteractionFinishRevision.ratios;
175
175
  if (typeof lastInteractionFinishVC90 === 'number') {
176
176
  var _postInteractionFinis;
177
177
  revisedVC90 = (_postInteractionFinis = postInteractionFinishRevision['metric:vc90']) !== null && _postInteractionFinis !== void 0 ? _postInteractionFinis : null;
@@ -141,7 +141,6 @@ var PostInteractionLog = /*#__PURE__*/function () {
141
141
  this.sinkHandlerFn({
142
142
  lastInteractionFinish: this.lastInteractionFinish,
143
143
  reactProfilerTimings: this.reactProfilerTimings,
144
- // NOTE: invoking `getVCResult` at latest possible point in time here (not earlier) to get the most accurate result (from performance.now())
145
144
  postInteractionFinishVCResult: postInteractionFinishVCResult,
146
145
  lastInteractionFinishVCResult: this.lastInteractionFinishVCResult
147
146
  });
@@ -78,9 +78,7 @@ export function init(analyticsWebClientAsync, config) {
78
78
  if (fg('platform_ufo_report_cpu_usage')) {
79
79
  initialisePressureObserver();
80
80
  }
81
- if (fg('platform_ufo_report_memory_usage')) {
82
- initialiseMemoryObserver();
83
- }
81
+ initialiseMemoryObserver();
84
82
  setUFOConfig(config);
85
83
  if ((_config$vc = config.vc) !== null && _config$vc !== void 0 && _config$vc.enabled) {
86
84
  var _config$experimentalI;
@@ -3,10 +3,10 @@ import UFOLoadHold from '../load-hold';
3
3
  import { LazySuspense, WaitContext } from './loosely-lazy';
4
4
 
5
5
  /**
6
- * Provides a placeholder for lazily loaded content, improving perceived performance.
6
+ * @private
7
+ * @deprecated Use `atlaskit/react-ufo/suspense` instead.
7
8
  *
8
- * Named placeholders are especially useful for analyzing page load breakdowns
9
- * in performance monitoring tools like Performance Portal.
9
+ * Provides a placeholder for lazily loaded content (via react-loosely-lazy), improving perceived performance.
10
10
  */
11
11
  export default function Placeholder(_ref) {
12
12
  var name = _ref.name,
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ import UFOLoadHold from '../load-hold';
3
+ var Suspense = function Suspense(_ref) {
4
+ var children = _ref.children,
5
+ fallback = _ref.fallback,
6
+ interactionName = _ref.interactionName;
7
+ return /*#__PURE__*/React.createElement(React.Suspense, {
8
+ fallback: /*#__PURE__*/React.createElement(UFOLoadHold, {
9
+ name: interactionName
10
+ }, fallback)
11
+ }, children);
12
+ };
13
+ export default Suspense;
@@ -0,0 +1,2 @@
1
+ import Suspense from './Suspense';
2
+ export default Suspense;
@@ -49,7 +49,7 @@ var VCCalculator_FY25_03 = /*#__PURE__*/function (_AbstractVCCalculator) {
49
49
  if (!attributeName || KNOWN_ATTRIBUTES_THAT_DOES_NOT_CAUSE_LAYOUT_SHIFTS.includes(attributeName)) {
50
50
  return false;
51
51
  }
52
- if (attributeName.startsWith('data-test') && fg('platform_ufo_ttvc_exclude_data_test_attribute') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || (attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck') && fg('platform_ufo_ignore_extra_attributes') || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
52
+ if (attributeName.startsWith('data-test') && fg('platform_ufo_ttvc_exclude_data_test_attribute') || attributeName === 'data-aui-version' || attributeName === 'data-testid' || attributeName === 'data-vc' || attributeName === 'data-ssr-placeholder' || attributeName === 'data-ssr-placeholder-replace' || attributeName === 'data-vc-nvs' || attributeName === 'data-media-vc-wrapper' || (attributeName === 'data-renderer-start-pos' || attributeName === 'data-table-local-id' || attributeName === 'spellcheck') && fg('platform_ufo_ignore_extra_attributes') || attributeName === 'data-auto-scrollable' || attributeName === 'id' || attributeName === 'tabindex' || attributeName === 'data-is-ttvc-ready' || NON_VISUAL_ARIA_ATTRIBUTES.includes(attributeName)) {
53
53
  return false;
54
54
  }
55
55
  return true;
@@ -7,7 +7,7 @@ export type AssetsConfigPreloadedArgs = {
7
7
  SSRDoneTime?: number;
8
8
  };
9
9
  export type AssetsConfig = {
10
- allowedTypes: string[];
10
+ allowedTypes?: string[];
11
11
  classification: {
12
12
  all: boolean;
13
13
  allAtlassian: (args: AssetsConfigAllAtlassianArgs) => boolean;
@@ -1,4 +1,4 @@
1
- import type { AssetsClassification, InteractionMetrics, InteractionType } from '../common';
1
+ import type { AssetsConfig, InteractionMetrics, InteractionType } from '../common';
2
2
  export interface AdditionalData {
3
3
  [key: string]: null | string | number | boolean | undefined | AdditionalData | Record<string, AdditionalData> | Array<AdditionalData>;
4
4
  }
@@ -27,7 +27,8 @@ type SelectorConfig = {
27
27
  type Rates = {
28
28
  readonly [key: string]: number;
29
29
  };
30
- type TTVCRevisions = 'fy25.01' | 'fy25.02' | 'fy25.03';
30
+ export type TTVCRevisions = 'fy25.01' | 'fy25.02' | 'fy25.03';
31
+ export declare const DEFAULT_TTVC_REVISION = "fy25.03";
31
32
  export type Config = {
32
33
  readonly enabled?: boolean;
33
34
  readonly interactionTimeout?: Record<string, number>;
@@ -43,15 +44,21 @@ export type Config = {
43
44
  readonly rate?: number;
44
45
  }[];
45
46
  readonly killswitch?: readonly string[];
47
+ /**
48
+ * @private
49
+ * @deprecated - remove on FG cleanup of platform_ufo_remove_deprecated_config_fields
50
+ */
46
51
  readonly killswitchNestedSegments?: boolean;
47
52
  readonly typingMethod?: string;
53
+ /**
54
+ * @private
55
+ * @deprecated - remove on FG cleanup of platform_ufo_remove_deprecated_config_fields
56
+ */
48
57
  readonly capability?: Record<Capability, number>;
49
58
  readonly kind?: Record<InteractionKind, number>;
50
59
  readonly allowedResources?: Array<ResourceType>;
51
60
  readonly allowedResourcesParams?: Array<string>;
52
61
  readonly autoGeneratedRate?: number;
53
- readonly removePageSegmentsUFOPrefixes?: boolean;
54
- readonly removeInteractionsUFOPrefixes?: boolean;
55
62
  readonly product: string;
56
63
  readonly region: string;
57
64
  readonly additionalPayloadData?: (interaction: InteractionMetrics) => AdditionalData;
@@ -59,12 +66,7 @@ export type Config = {
59
66
  readonly getSSRTimings?: () => SSRTiming[];
60
67
  readonly getSSRDoneTime?: () => number | undefined;
61
68
  };
62
- /**
63
- * @private
64
- * @deprecated remove me with next major release
65
- */
66
- readonly assetsClassification?: AssetsClassification;
67
- readonly assetsConfig?: AssetsClassification;
69
+ readonly assetsConfig?: AssetsConfig;
68
70
  readonly enableBetterPageVisibilityApi?: boolean;
69
71
  readonly vc?: {
70
72
  readonly enabled?: boolean;
@@ -106,14 +108,13 @@ export type Config = {
106
108
  };
107
109
  readonly enableSegmentHighlighting?: boolean;
108
110
  readonly enableAdditionalPerformanceMarks?: boolean;
109
- readonly shouldCalculateLighthouseMetricsFromTTAI?: boolean;
110
- readonly timeWindowForLateMutationsInMilliseconds?: number;
111
- readonly manuallyTrackReactProfilerMounts?: boolean;
112
111
  /**
113
112
  * @private
114
- * @deprecated setting this will do nothing now
113
+ * @deprecated - remove on FG cleanup of platform_ufo_remove_deprecated_config_fields
115
114
  */
116
- readonly enableCompleteUsingDoubleRAF?: boolean;
115
+ readonly shouldCalculateLighthouseMetricsFromTTAI?: boolean;
116
+ readonly timeWindowForLateMutationsInMilliseconds?: number;
117
+ readonly manuallyTrackReactProfilerMounts?: boolean;
117
118
  };
118
119
  export declare function setUFOConfig(newConfig: Config): void;
119
120
  export declare function getConfig(): Config | undefined;
@@ -128,8 +129,6 @@ declare const validTypingMethods: readonly ["timeout", "timeoutNoAlloc", "mutati
128
129
  type ValidTypingMethod = (typeof validTypingMethods)[number];
129
130
  export declare function getTypingPerformanceTracingMethod(): ValidTypingMethod;
130
131
  export declare function getAwaitBM3TTIList(): string[];
131
- export declare function getRemovePageSegmentsUFOPrefixes(): boolean;
132
- export declare function getRemoveInteractionsUFOPrefixes(): boolean;
133
132
  export declare function getUfoNameOverrides(): UFONameOverride | undefined;
134
133
  export declare function getDoNotAbortActivePressInteraction(): string[] | undefined;
135
134
  export declare function getDoNotAbortActivePressInteractionOnTransition(): string[] | undefined;