chore(timeseries): Loosen series comparison conditions (#101249)

A few improvements based on recent findings.

1. Do not compare numeric values of incomplete buckets. This is
generally pointless, those buckets don't have all the data, so they
change a lot, and we don't really care about differences there
2. Do not re-run comparison on `data` change. This causes huge log
spikes in the Logs view, which re-loads the data a lot on live refresh.
Instead, just react to loading state changes

Author: gggritso

static/app/views/insights/common/queries/useSortedTimeSeries.tsx

@@ -1,4 +1,5 @@
 import {useEffect, useMemo, useState} from 'react';
+import {useEffectEvent} from '@react-aria/utils';
 import * as Sentry from '@sentry/react';
 import isEmpty from 'lodash/isEmpty';
 import isEqualWith from 'lodash/isEqualWith';
@@ -186,26 +187,32 @@ export const useSortedTimeSeries = <
       : {};
   }, [timeSeriesResult.data]);
 
-  useEffect(() => {
-    if (
-      isTimeSeriesEndpointComparisonEnabled &&
-      !result.isFetching &&
-      !isEmpty(data) &&
-      !timeSeriesResult.isFetching &&
-      !isEmpty(otherData)
-    ) {
+  // We don't want to re-run the comparison every time the `data` changes, since
+  // `data` might be changed or mutated by the live reload functionality.
+  // Instead, extract that into an effect event so it doesn't have a dependency
+  // on `data`.
+  const compareResponses = useEffectEvent(() => {
+    if (!isEmpty(data) && !isEmpty(otherData)) {
       if (!isEqualWith(data, otherData, comparator)) {
         warn(`\`useDiscoverSeries\` found a data difference in responses`, {
           statsData: JSON.stringify(data),
           timeSeriesData: JSON.stringify(otherData),
         });
       }
     }
+  });
+
+  useEffect(() => {
+    if (
+      isTimeSeriesEndpointComparisonEnabled &&
+      !result.isFetching &&
+      !timeSeriesResult.isFetching
+    ) {
+      compareResponses();
+    }
   }, [
     isTimeSeriesEndpointComparisonEnabled,
-    data,
     result.isFetching,
-    otherData,
     timeSeriesResult.isFetching,
   ]);
 
@@ -370,14 +377,18 @@ const NUMERIC_KEYS: Array<symbol | string | number> = [
 function comparator(
   valueA: unknown,
   valueB: unknown,
-  key: symbol | string | number | undefined
+  key: symbol | string | number | undefined,
+  objA: Record<PropertyKey, unknown>,
+  objB: Record<PropertyKey, unknown>
 ) {
   // Compare numbers by near equality, which makes the comparison less sensitive to small natural variations in value caused by request sequencing
   if (
     key &&
     NUMERIC_KEYS.includes(key) &&
     typeof valueA === 'number' &&
-    typeof valueB === 'number'
+    typeof valueB === 'number' &&
+    !objA?.incomplete &&
+    !objB?.incomplete
   ) {
     return areNumbersAlmostEqual(valueA, valueB, 5);
   }