Used memoization technique in critical path computation

Now only everyTime the input changes critical path algorithm is computed

Signed-off-by: GLVS Kiriti <glvskiriti2003369@gmail.com>

packages/jaeger-ui/src/components/TracePage/CriticalPath/index.tsx

@@ -12,19 +12,13 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { Span, Trace } from '../../../types/trace';
+import memoizeOne from 'memoize-one';
+import { Span, Trace,criticalPathSection } from '../../../types/trace';
 import findChildSpanIds from './utils/findChildSpanIds';
 import findLastFinishingChildSpanId from './utils/findLastFinishingChildSpanId';
 import findRootSpanId from './utils/findRootSpanId';
 import sanitizeOverFlowingChildren from './utils/sanitizeOverFlowingChildren';
 
-// It is a section of span that lies on critical path
-type criticalPathSection = {
-  spanId: string;
-  section_start: number;
-  section_end: number;
-};
-
 export const computeCriticalPath = (
   traceData: Trace,
   spanId: string,
@@ -69,17 +63,18 @@ export const computeCriticalPath = (
 function TraceCriticalPath(trace: Trace) {
   let traceData: Trace = trace;
   let criticalPath: criticalPathSection[] = [];
-
+  console.log("Hi");
   const rootSpanId = findRootSpanId(trace.spans);
   // If there is root span then algorithm implements
   if (rootSpanId) {
     const sanitizedSpanData = sanitizeOverFlowingChildren(trace.spans);
     const refinedSpanData = findChildSpanIds(sanitizedSpanData);
     traceData = { ...traceData, spans: refinedSpanData };
     criticalPath = computeCriticalPath(traceData, rootSpanId, []);
-    return criticalPath;
   }
-  return null;
+  return criticalPath;
 }
 
-export default TraceCriticalPath;
+const memoizedTraceCriticalPath = memoizeOne(TraceCriticalPath);
+
+export default memoizedTraceCriticalPath;

packages/jaeger-ui/src/components/TracePage/index.tsx

@@ -61,7 +61,7 @@ import TraceFlamegraph from './TraceFlamegraph/index';
 import { TraceGraphConfig } from '../../types/config';
 
 import './index.css';
-import TraceCriticalPath from './CriticalPath/index';
+import memoizedTraceCriticalPath from './CriticalPath/index';
 
 type TDispatchProps = {
   acknowledgeArchive: (id: string) => void;
@@ -389,6 +389,7 @@ export class TracePageImpl extends React.PureComponent<TProps, TState> {
     };
 
     let view;
+    const criticalPath = memoizedTraceCriticalPath(data);
     if (ETraceViewType.TraceTimelineViewer === viewType && headerHeight) {
       view = (
         <TraceTimelineViewer
@@ -419,8 +420,6 @@ export class TracePageImpl extends React.PureComponent<TProps, TState> {
       view = <TraceFlamegraph trace={trace} />;
     }
 
-    const criticalPath = TraceCriticalPath(data);
-
     return (
       <div>
         {archiveEnabled && (

packages/jaeger-ui/src/types/trace.tsx

@@ -84,3 +84,10 @@ export type Trace = TraceData & {
   traceName: string;
   services: { name: string; numberOfSpans: number }[];
 };
+
+// It is a section of span that lies on critical path
+export type criticalPathSection = {
+  spanId: string;
+  section_start: number;
+  section_end: number;
+};