[Profiling] Add colors for new frame types (exe name, thread name, root)

elastic · Jan 7, 2025 · bc95574 · bc95574
1 parent d0166b6
commit bc95574
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 0 deletions.
diff --git a/src/platform/packages/shared/kbn-profiling-utils/common/profiling.ts b/src/platform/packages/shared/kbn-profiling-utils/common/profiling.ts
@@ -37,6 +37,11 @@ export enum FrameType {
   DotNET,
   ErrorFlag = 0x80,
   Error = 0xff,
+
+  // Artificial frame types for grouping, set by the ES profiling plugin
+  Root = 0x100,
+  ExecutableName = 0x101,
+  ThreadName = 0x102,
 }
 
 const frameTypeDescriptions = {
@@ -53,6 +58,9 @@ const frameTypeDescriptions = {
   [FrameType.DotNET]: '.NET',
   [FrameType.ErrorFlag]: 'ErrorFlag',
   [FrameType.Error]: 'Error',
+  [FrameType.Root]: 'Root',
+  [FrameType.ExecutableName]: 'Executable',
+  [FrameType.ThreadName]: 'Thread',
 };
 
 export function isErrorFrame(ft: FrameType): boolean {

diff --git a/x-pack/solutions/observability/plugins/profiling/common/frame_type_colors.ts b/x-pack/solutions/observability/plugins/profiling/common/frame_type_colors.ts
@@ -28,6 +28,10 @@ import { FrameType, normalizeFrameType } from '@kbn/profiling-utils';
  *
  * Taken originally from prodfiler_ui/src/helpers/Pixi/frameTypeToColors.tsx
  */
+const RED = 0xfd8484;
+const ORANGE = 0xffaa00;
+const YELLOW = 0xe1e100;
+
 export const FRAME_TYPE_COLOR_MAP = {
   [FrameType.Unsymbolized]: [0xfd8484, 0xfd9d9d, 0xfeb5b5, 0xfecece],
   [FrameType.Python]: [0xfcae6b, 0xfdbe89, 0xfdcea6, 0xfedfc4],
@@ -42,6 +46,9 @@ export const FRAME_TYPE_COLOR_MAP = {
   [FrameType.DotNET]: [0x6c60e1, 0x8075e5, 0x948be9, 0xa8a0ed],
   [FrameType.ErrorFlag]: [0x0, 0x0, 0x0, 0x0], // This is a special case, it's not a real frame type
   [FrameType.Error]: [0xfd8484, 0xfd9d9d, 0xfeb5b5, 0xfecece],
+  [FrameType.Root]: [RED, RED, RED, RED],
+  [FrameType.ExecutableName]: [ORANGE, ORANGE, ORANGE, ORANGE],
+  [FrameType.ThreadName]: [YELLOW, YELLOW, YELLOW, YELLOW],
 };
 
 export function frameTypeToRGB(frameType: FrameType, x: number): number {

diff --git a/x-pack/solutions/observability/plugins/profiling/public/utils/get_flamegraph_model/index.ts b/x-pack/solutions/observability/plugins/profiling/public/utils/get_flamegraph_model/index.ts
@@ -180,6 +180,10 @@ export function getFlamegraphModel({
       Object.entries(FRAME_TYPE_COLOR_MAP).map(([frameTypeKey, colors]) => {
         const frameType = Number(frameTypeKey) as FrameType;
 
+        if (frameType === FrameType.Root) {
+          return undefined;
+        }
+
         return usedFrameTypes.has(frameType)
           ? {
               color: `#${colors[0].toString(16)}`,