Browse Source

feat(perf): Hide timing metrics on http (#52993)

### Summary
Timing metrics for http are coming out but there are a lot and there is
already a lot of keys on the span details, this will hide the timing
metrics for now. We can opt-in specific ones on a case-by-case later.
Kev 1 year ago
parent
commit
145df55c8f
1 changed files with 25 additions and 6 deletions
  1. 25 6
      static/app/components/events/interfaces/spans/spanDetail.tsx

+ 25 - 6
static/app/components/events/interfaces/spans/spanDetail.tsx

@@ -69,6 +69,19 @@ const SIZE_DATA_KEYS = [
   'http.response_transfer_size',
 ];
 
+const HIDDEN_DATA_KEYS = [
+  'http.request.redirect_start',
+  'http.request.fetch_start',
+  'http.request.domain_lookup_start',
+  'http.request.domain_lookup_end',
+  'http.request.connect_start',
+  'http.request.secure_connection_start',
+  'http.request.connection_end',
+  'http.request.request_start',
+  'http.request.response_start',
+  'http.request.response_end',
+];
+
 type TransactionResult = {
   id: string;
   'project.name': string;
@@ -88,6 +101,10 @@ type Props = {
   trace: Readonly<ParsedTraceType>;
 };
 
+function isSpanKeyVisible(key: string) {
+  return !HIDDEN_DATA_KEYS.includes(key);
+}
+
 function SpanDetail(props: Props) {
   const [errorsOpened, setErrorsOpened] = useState(false);
   const location = useLocation();
@@ -390,7 +407,7 @@ function SpanDetail(props: Props) {
     const durationString = `${Number(duration.toFixed(3)).toLocaleString()}ms`;
 
     const unknownKeys = Object.keys(span).filter(key => {
-      return !rawSpanKeys.has(key as any);
+      return isSpanKeyVisible(key) && !rawSpanKeys.has(key as any);
     });
 
     const {sizeKeys, nonSizeKeys} = partitionSizes(span?.data ?? {});
@@ -522,11 +539,13 @@ function SpanDetail(props: Props) {
                   </Fragment>
                 </Row>
               ))}
-              {map(nonSizeKeys, (value, key) => (
-                <Row title={key} key={key}>
-                  {maybeStringify(value)}
-                </Row>
-              ))}
+              {map(nonSizeKeys, (value, key) =>
+                isSpanKeyVisible(key) ? (
+                  <Row title={key} key={key}>
+                    {maybeStringify(value)}
+                  </Row>
+                ) : null
+              )}
               {unknownKeys.map(key => (
                 <Row title={key} key={key}>
                   {maybeStringify(span[key])}