Rewrite computeSelfTime to improve performance on Trace Statistics page

Stop using drange

For 10k spans, 1s => 1ms, computeSelfTime is no longer visible in a profiler

To test:
1. Generate data: go run cmd/tracegen/main.go -service abcd -traces 1 -spans 10000
1. Go to Trace Statistics
1. Change Group By to Operation Name
1. Change Group By to Service Name

Signed-off-by: Damian Maslanka <[email protected]>

Author: DamianMaslanka5

packages/jaeger-ui/src/components/TracePage/TraceStatistics/tableValues.tsx

@@ -14,7 +14,6 @@
 
 import memoizeOne from 'memoize-one';
 import _uniq from 'lodash/uniq';
-import DRange from 'drange';
 import { Trace, Span } from '../../../types/trace';
 import { ITableSpan } from './types';
 import colorGenerator from '../../../utils/color-generator';
@@ -45,21 +44,47 @@ function getChildOfSpans(parentID: string, allSpans: Span[]): Span[] {
 
 function computeSelfTime(span: Span, allSpans: Span[]): number {
   if (!span.hasChildren) return span.duration;
-  // We want to represent spans as half-open intervals like [startTime, startTime + duration).
-  // This way the subtraction preserves the right boundaries. However, DRange treats all
-  // intervals as inclusive. For example,
-  //       range(1, 10).subtract(4, 8) => range([1, 3], [9-10])
-  //       length=(3-1)+(10-9)=2+1=3
-  // In other words, we took an interval of length=10-1=9 and subtracted length=8-4=4.
-  // We should've ended up with length 9-4=5, but we got 3.
-  // To work around that, we multiply start/end times by 10 and subtract one from the end.
-  // So instead of [1-10] we get [10-99]. This makes the intervals work like half-open.
-  const spanRange = new DRange(10 * span.startTime, 10 * (span.startTime + span.duration) - 1);
-  const children = getChildOfSpans(span.spanID, allSpans);
-  children.forEach(child => {
-    spanRange.subtract(10 * child.startTime, 10 * (child.startTime + child.duration) - 1);
-  });
-  return Math.round(spanRange.length / 10);
+
+  let spanSelfTime = span.duration;
+  let previousSpanEndTime = span.startTime;
+
+  const children = getChildOfSpans(span.spanID, allSpans).sort((a,b) => a.startTime - b.startTime );
+
+  const parentSpanEndTime = span.startTime + span.duration;
+
+  for (let index = 0; index < children.length; index++) {
+    const child = children[index];
+    
+    const spanEndTime = child.startTime + child.duration;
+    const spanStartsAfterParentEnded = child.startTime > parentSpanEndTime;
+    const spanEndsBeforePreviousSpan = spanEndTime < previousSpanEndTime;
+    if (spanStartsAfterParentEnded || spanEndsBeforePreviousSpan) {
+      continue;
+    }
+
+    let nonOverlappingStartTime = child.startTime;
+    let nonOverlappingDuration = child.duration;
+
+    const spanStartsBeforePreviousSpanEnds = child.startTime < previousSpanEndTime;
+    if (spanStartsBeforePreviousSpanEnds) {
+      const diff = previousSpanEndTime - child.startTime
+      nonOverlappingDuration = child.duration - diff;
+      nonOverlappingStartTime = previousSpanEndTime;
+    }
+    // last span which can be included in self time calculation, because it ends after parent span ends
+    else if (spanEndTime > parentSpanEndTime) {
+      const diff = spanEndTime - parentSpanEndTime
+
+      nonOverlappingDuration = child.duration - diff;
+      spanSelfTime -= nonOverlappingDuration
+      break;
+    }
+
+    spanSelfTime -= nonOverlappingDuration
+    previousSpanEndTime = nonOverlappingStartTime + nonOverlappingDuration;
+  }
+
+  return spanSelfTime
 }
 
 function computeColumnValues(trace: Trace, span: Span, allSpans: Span[], resultValue: StatsPerTag) {