Browse Source

fix(perf): Remove React Profiler (#60712)

We suspect that this is causing JAVASCRIPT-2K8Z so we want to try
running without it to see if it helps. Temporary! Stubs out `Profiler`.
George Gritsouk 1 year ago
parent
commit
f7b3188577

+ 2 - 2
static/app/components/gridEditable/index.tsx

@@ -1,11 +1,11 @@
-import {Component, createRef, Fragment, Profiler, ReactNode} from 'react';
+import {Component, createRef, Fragment, ReactNode} from 'react';
 import {Location} from 'history';
 
 import EmptyStateWarning from 'sentry/components/emptyStateWarning';
 import LoadingIndicator from 'sentry/components/loadingIndicator';
 import {IconWarning} from 'sentry/icons';
 import {t} from 'sentry/locale';
-import {onRenderCallback} from 'sentry/utils/performanceForSentry';
+import {onRenderCallback, Profiler} from 'sentry/utils/performanceForSentry';
 
 import {
   Body,

+ 5 - 1
static/app/utils/performanceForSentry/index.tsx

@@ -1,4 +1,4 @@
-import {Fragment, Profiler, ReactNode, useEffect, useRef} from 'react';
+import {Fragment, ReactNode, useEffect, useRef} from 'react';
 import {captureMessage, setExtra, setTag} from '@sentry/react';
 import * as Sentry from '@sentry/react';
 import {IdleTransaction} from '@sentry/tracing';
@@ -24,6 +24,10 @@ const ASSET_OUTLIER_VALUE = 1_000_000_000; // Assets over 1GB are ignored since
 const VCD_START = 'vcd-start';
 const VCD_END = 'vcd-end';
 
+export function Profiler(props: {children: React.ReactNode; id: string; onRender: any}) {
+  return <Fragment>{props.children}</Fragment>;
+}
+
 /**
  * It depends on where it is called but the way we fetch transactions can be empty despite an ongoing transaction existing.
  * This will return an interaction-type transaction held onto by a class static if one exists.

+ 2 - 2
static/app/views/app/index.tsx

@@ -1,4 +1,4 @@
-import {lazy, Profiler, Suspense, useCallback, useEffect, useRef} from 'react';
+import {lazy, Suspense, useCallback, useEffect, useRef} from 'react';
 import {RouteComponentProps} from 'react-router';
 import styled from '@emotion/styled';
 
@@ -20,7 +20,7 @@ import HookStore from 'sentry/stores/hookStore';
 import OrganizationsStore from 'sentry/stores/organizationsStore';
 import {useLegacyStore} from 'sentry/stores/useLegacyStore';
 import isValidOrgSlug from 'sentry/utils/isValidOrgSlug';
-import {onRenderCallback} from 'sentry/utils/performanceForSentry';
+import {onRenderCallback, Profiler} from 'sentry/utils/performanceForSentry';
 import useApi from 'sentry/utils/useApi';
 import {useColorscheme} from 'sentry/utils/useColorscheme';
 import {useHotkeys} from 'sentry/utils/useHotkeys';

+ 6 - 2
static/app/views/projectsDashboard/index.tsx

@@ -1,4 +1,4 @@
-import {Fragment, Profiler, useEffect, useMemo, useState} from 'react';
+import {Fragment, useEffect, useMemo, useState} from 'react';
 import LazyLoad, {forceCheck} from 'react-lazyload';
 import {RouteComponentProps} from 'react-router';
 import styled from '@emotion/styled';
@@ -25,7 +25,11 @@ import ProjectsStatsStore from 'sentry/stores/projectsStatsStore';
 import {space} from 'sentry/styles/space';
 import {Organization, Project, TeamWithProjects} from 'sentry/types';
 import {sortProjects} from 'sentry/utils';
-import {onRenderCallback, setGroupedEntityTag} from 'sentry/utils/performanceForSentry';
+import {
+  onRenderCallback,
+  Profiler,
+  setGroupedEntityTag,
+} from 'sentry/utils/performanceForSentry';
 import useOrganization from 'sentry/utils/useOrganization';
 import withApi from 'sentry/utils/withApi';
 import withOrganization from 'sentry/utils/withOrganization';

+ 0 - 2
webpack.config.ts

@@ -419,8 +419,6 @@ const appConfig: Configuration = {
 
   resolve: {
     alias: {
-      'react-dom$': 'react-dom/profiling',
-      'scheduler/tracing': 'scheduler/tracing-profiling',
       sentry: path.join(staticPrefix, 'app'),
       'sentry-images': path.join(staticPrefix, 'images'),
       'sentry-logos': path.join(sentryDjangoAppPath, 'images', 'logos'),