ref: Don't use BFCache

Author: AbhiPrasad

packages/tracing/src/browser/web-vitals/README.md

@@ -16,10 +16,6 @@ Current vendored web vitals are:
 
 [Apache 2.0](https://github.com/GoogleChrome/web-vitals/blob/master/LICENSE)
 
- ## Notable differences from `web-vitals` library
-
- TODO(abhi): Fill this out
-
 ## CHANGELOG
 
 https://github.com/getsentry/sentry-javascript/pull/3515

packages/tracing/src/browser/web-vitals/getCLS.ts

@@ -14,11 +14,9 @@
  * limitations under the License.
  */
 
-import { getFCP } from './getFCP';
 import { bindReporter } from './lib/bindReporter';
 import { initMetric } from './lib/initMetric';
 import { observe, PerformanceEntryHandler } from './lib/observe';
-import { onBFCacheRestore } from './lib/onBFCacheRestore';
 import { onHidden } from './lib/onHidden';
 import { ReportHandler } from './types';
 
@@ -36,26 +34,8 @@ export interface LayoutShiftAttribution {
   currentRect: DOMRectReadOnly;
 }
 
-let isMonitoringFCP = false;
-let fcpValue = -1;
-
 export const getCLS = (onReport: ReportHandler, reportAllChanges?: boolean): void => {
-  // Start monitoring FCP so we can only report CLS if FCP is also reported.
-  // Note: this is done to match the current behavior of CrUX.
-  if (!isMonitoringFCP) {
-    getFCP(metric => {
-      fcpValue = metric.value;
-    });
-    isMonitoringFCP = true;
-  }
-
-  const onReportWrapped: ReportHandler = arg => {
-    if (fcpValue > -1) {
-      onReport(arg);
-    }
-  };
-
-  let metric = initMetric('CLS', 0);
+  const metric = initMetric('CLS', 0);
   let report: ReturnType<typeof bindReporter>;
 
   let sessionValue = 0;
@@ -94,18 +74,11 @@ export const getCLS = (onReport: ReportHandler, reportAllChanges?: boolean): voi
 
   const po = observe('layout-shift', entryHandler as PerformanceEntryHandler);
   if (po) {
-    report = bindReporter(onReportWrapped, metric, reportAllChanges);
+    report = bindReporter(onReport, metric, reportAllChanges);
 
     onHidden(() => {
       po.takeRecords().map(entryHandler as PerformanceEntryHandler);
       report(true);
     });
-
-    onBFCacheRestore(() => {
-      sessionValue = 0;
-      fcpValue = -1;
-      metric = initMetric('CLS', 0);
-      report = bindReporter(onReportWrapped, metric, reportAllChanges);
-    });
   }
 };

packages/tracing/src/browser/web-vitals/getFCP.ts

@@ -18,42 +18,29 @@ import { bindReporter } from './lib/bindReporter';
 import { getVisibilityWatcher } from './lib/getVisibilityWatcher';
 import { initMetric } from './lib/initMetric';
 import { observe, PerformanceEntryHandler } from './lib/observe';
-import { onBFCacheRestore } from './lib/onBFCacheRestore';
 import { onHidden } from './lib/onHidden';
-import { firstInputPolyfill, resetFirstInputPolyfill } from './lib/polyfills/firstInputPolyfill';
-import { FirstInputPolyfillCallback, PerformanceEventTiming, ReportHandler } from './types';
+import { PerformanceEventTiming, ReportHandler } from './types';
 
 export const getFID = (onReport: ReportHandler, reportAllChanges?: boolean): void => {
   const visibilityWatcher = getVisibilityWatcher();
-  let metric = initMetric('FID');
+  const metric = initMetric('FID');
   let report: ReturnType<typeof bindReporter>;
 
   const entryHandler = (entry: PerformanceEventTiming): void => {
     // Only report if the page wasn't hidden prior to the first input.
-    if (entry.startTime < visibilityWatcher.firstHiddenTime) {
+    if (report && entry.startTime < visibilityWatcher.firstHiddenTime) {
       metric.value = entry.processingStart - entry.startTime;
       metric.entries.push(entry);
       report(true);
     }
   };
 
   const po = observe('first-input', entryHandler as PerformanceEntryHandler);
-  report = bindReporter(onReport, metric, reportAllChanges);
-
   if (po) {
+    report = bindReporter(onReport, metric, reportAllChanges);
     onHidden(() => {
       po.takeRecords().map(entryHandler as PerformanceEntryHandler);
       po.disconnect();
     }, true);
   }
-
-  // Only monitor bfcache restores if the browser supports FID natively.
-  if (po) {
-    onBFCacheRestore(() => {
-      metric = initMetric('FID');
-      report = bindReporter(onReport, metric, reportAllChanges);
-      resetFirstInputPolyfill();
-      firstInputPolyfill(entryHandler as FirstInputPolyfillCallback);
-    });
-  }
 };

packages/tracing/src/browser/web-vitals/getFID.ts

@@ -18,7 +18,6 @@ import { bindReporter } from './lib/bindReporter';
 import { getVisibilityWatcher } from './lib/getVisibilityWatcher';
 import { initMetric } from './lib/initMetric';
 import { observe, PerformanceEntryHandler } from './lib/observe';
-import { onBFCacheRestore } from './lib/onBFCacheRestore';
 import { onHidden } from './lib/onHidden';
 import { ReportHandler } from './types';
 
@@ -37,7 +36,7 @@ const reportedMetricIDs: Set<string> = new Set();
 
 export const getLCP = (onReport: ReportHandler, reportAllChanges?: boolean): void => {
   const visibilityWatcher = getVisibilityWatcher();
-  let metric = initMetric('LCP');
+  const metric = initMetric('LCP');
   let report: ReturnType<typeof bindReporter>;
 
   const entryHandler = (entry: PerformanceEntry): void => {
@@ -77,17 +76,5 @@ export const getLCP = (onReport: ReportHandler, reportAllChanges?: boolean): voi
     });
 
     onHidden(stopListening, true);
-
-    onBFCacheRestore(event => {
-      metric = initMetric('LCP');
-      report = bindReporter(onReport, metric, reportAllChanges);
-      requestAnimationFrame(() => {
-        requestAnimationFrame(() => {
-          metric.value = performance.now() - event.timeStamp;
-          reportedMetricIDs.add(metric.id);
-          report(true);
-        });
-      });
-    });
   }
 };

packages/tracing/src/browser/web-vitals/getLCP.ts

@@ -14,7 +14,6 @@
  * limitations under the License.
  */
 
-import { onBFCacheRestore } from './onBFCacheRestore';
 import { onHidden } from './onHidden';
 
 let firstHiddenTime = -1;
@@ -40,17 +39,6 @@ export const getVisibilityWatcher = (): {
     // visibilityState.
     firstHiddenTime = initHiddenTime();
     trackChanges();
-
-    // Reset the time on bfcache restores.
-    onBFCacheRestore(() => {
-      // Schedule a task in order to track the `visibilityState` once it's
-      // had an opportunity to change to visible in all browsers.
-      // https://bugs.chromium.org/p/chromium/issues/detail?id=1133363
-      setTimeout(() => {
-        firstHiddenTime = initHiddenTime();
-        trackChanges();
-      }, 0);
-    });
   }
   return {
     get firstHiddenTime() {