@grafana/flamegraph
Version:
Grafana flamegraph visualization component
1 lines • 23.4 kB
Source Map (JSON)
{"version":3,"file":"rendering.mjs","sources":["../../../src/FlameGraph/rendering.ts"],"sourcesContent":["import { RefObject, useCallback, useEffect, useMemo, useState } from 'react';\nimport color from 'tinycolor2';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useTheme2 } from '@grafana/ui';\n\nimport {\n BAR_BORDER_WIDTH,\n BAR_TEXT_PADDING_LEFT,\n MUTE_THRESHOLD,\n HIDE_THRESHOLD,\n LABEL_THRESHOLD,\n PIXELS_PER_LEVEL,\n GROUP_STRIP_WIDTH,\n GROUP_STRIP_PADDING,\n GROUP_STRIP_MARGIN_LEFT,\n GROUP_TEXT_OFFSET,\n} from '../constants';\nimport { ClickedItemData, ColorScheme, ColorSchemeDiff, TextAlign } from '../types';\n\nimport { getBarColorByDiff, getBarColorByPackage, getBarColorByValue } from './colors';\nimport { CollapseConfig, CollapsedMap, FlameGraphDataContainer, LevelItem } from './dataTransform';\n\ntype RenderOptions = {\n canvasRef: RefObject<HTMLCanvasElement>;\n data: FlameGraphDataContainer;\n root: LevelItem;\n direction: 'children' | 'parents';\n\n // Depth in number of levels\n depth: number;\n wrapperWidth: number;\n\n // If we are rendering only zoomed in part of the graph.\n rangeMin: number;\n rangeMax: number;\n\n matchedLabels: Set<string> | undefined;\n textAlign: TextAlign;\n\n // Total ticks that will be used for sizing\n totalViewTicks: number;\n // Total ticks that will be used for computing colors as some color scheme (like in diff view) should not be affected\n // by sandwich or focus view.\n totalColorTicks: number;\n // Total ticks used to compute the diff colors\n totalTicksRight: number | undefined;\n colorScheme: ColorScheme | ColorSchemeDiff;\n focusedItemData?: ClickedItemData;\n collapsedMap: CollapsedMap;\n};\n\nexport function useFlameRender(options: RenderOptions) {\n const {\n canvasRef,\n data,\n root,\n depth,\n direction,\n wrapperWidth,\n rangeMin,\n rangeMax,\n matchedLabels,\n textAlign,\n totalViewTicks,\n totalColorTicks,\n totalTicksRight,\n colorScheme,\n focusedItemData,\n collapsedMap,\n } = options;\n const ctx = useSetupCanvas(canvasRef, wrapperWidth, depth);\n const theme = useTheme2();\n\n // There is a bit of dependency injections here that does not add readability, mainly to prevent recomputing some\n // common stuff for all the nodes in the graph when only once is enough. perf/readability tradeoff.\n\n const mutedColor = useMemo(() => {\n const barMutedColor = color(theme.colors.background.secondary);\n return theme.isLight ? barMutedColor.darken(10).toHexString() : barMutedColor.lighten(10).toHexString();\n }, [theme]);\n\n const getBarColor = useColorFunction(\n totalColorTicks,\n totalTicksRight,\n colorScheme,\n theme,\n mutedColor,\n rangeMin,\n rangeMax,\n matchedLabels,\n focusedItemData ? focusedItemData.item.level : 0\n );\n\n const renderFunc = useRenderFunc(ctx, data, getBarColor, textAlign, collapsedMap);\n\n useEffect(() => {\n if (!ctx) {\n return;\n }\n\n ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n\n const mutedPath2D = new Path2D();\n\n //\n // Walk the tree and compute the dimensions for each item in the flamegraph.\n //\n walkTree(\n root,\n direction,\n data,\n totalViewTicks,\n rangeMin,\n rangeMax,\n wrapperWidth,\n collapsedMap,\n (item, x, y, width, height, label, muted) => {\n if (muted) {\n // We do a bit of optimization for muted regions, and we render them all in single fill later on as they don't\n // have labels and are the same color.\n mutedPath2D.rect(x, y, width, height);\n } else {\n renderFunc(item, x, y, width, height, label);\n }\n }\n );\n\n // Only fill the muted rects\n ctx.fillStyle = mutedColor;\n ctx.fill(mutedPath2D);\n }, [\n ctx,\n data,\n root,\n wrapperWidth,\n rangeMin,\n rangeMax,\n totalViewTicks,\n direction,\n renderFunc,\n collapsedMap,\n mutedColor,\n ]);\n}\n\ntype RenderFunc = (item: LevelItem, x: number, y: number, width: number, height: number, label: string) => void;\n\ntype RenderFuncWrap = (\n item: LevelItem,\n x: number,\n y: number,\n width: number,\n height: number,\n label: string,\n muted: boolean\n) => void;\n\n/**\n * Create a render function with some memoization to prevent excesive repainting of the canvas.\n * @param ctx\n * @param data\n * @param getBarColor\n * @param textAlign\n * @param collapsedMap\n */\nfunction useRenderFunc(\n ctx: CanvasRenderingContext2D | undefined,\n data: FlameGraphDataContainer,\n getBarColor: (item: LevelItem, label: string, muted: boolean) => string,\n textAlign: TextAlign,\n collapsedMap: CollapsedMap\n) {\n return useMemo(() => {\n if (!ctx) {\n return () => {};\n }\n\n const renderFunc: RenderFunc = (item, x, y, width, height, label) => {\n ctx.beginPath();\n ctx.rect(x + BAR_BORDER_WIDTH, y, width, height);\n ctx.fillStyle = getBarColor(item, label, false);\n ctx.stroke();\n ctx.fill();\n\n const collapsedItemConfig = collapsedMap.get(item);\n let finalLabel = label;\n if (collapsedItemConfig && collapsedItemConfig.collapsed) {\n const numberOfCollapsedItems = collapsedItemConfig.items.length;\n finalLabel = `(${numberOfCollapsedItems}) ` + label;\n }\n\n if (width >= LABEL_THRESHOLD) {\n if (collapsedItemConfig) {\n renderLabel(\n ctx,\n data,\n finalLabel,\n item,\n width,\n textAlign === 'left' ? x + GROUP_STRIP_MARGIN_LEFT + GROUP_TEXT_OFFSET : x,\n y,\n textAlign\n );\n\n renderGroupingStrip(ctx, x, y, height, item, collapsedItemConfig);\n } else {\n renderLabel(ctx, data, finalLabel, item, width, x, y, textAlign);\n }\n }\n };\n\n return renderFunc;\n }, [ctx, getBarColor, textAlign, data, collapsedMap]);\n}\n\n/**\n * Render small strip on the left side of the bar to indicate that this item is part of a group that can be collapsed.\n * @param ctx\n * @param x\n * @param y\n * @param height\n * @param item\n * @param collapsedItemConfig\n */\nfunction renderGroupingStrip(\n ctx: CanvasRenderingContext2D,\n x: number,\n y: number,\n height: number,\n item: LevelItem,\n collapsedItemConfig: CollapseConfig\n) {\n const groupStripX = x + GROUP_STRIP_MARGIN_LEFT;\n\n // This is to mask the label in case we align it right to left.\n ctx.beginPath();\n ctx.rect(x, y, groupStripX - x + GROUP_STRIP_WIDTH + GROUP_STRIP_PADDING, height);\n ctx.fill();\n\n // For item in a group that can be collapsed, we draw a small strip to mark them. On the items that are at the\n // start or and end of a group we draw just half the strip so 2 groups next to each other are separated\n // visually.\n ctx.beginPath();\n if (collapsedItemConfig.collapsed) {\n ctx.rect(groupStripX, y + height / 4, GROUP_STRIP_WIDTH, height / 2);\n } else {\n if (collapsedItemConfig.items[0] === item) {\n // Top item\n ctx.rect(groupStripX, y + height / 2, GROUP_STRIP_WIDTH, height / 2);\n } else if (collapsedItemConfig.items[collapsedItemConfig.items.length - 1] === item) {\n // Bottom item\n ctx.rect(groupStripX, y, GROUP_STRIP_WIDTH, height / 2);\n } else {\n ctx.rect(groupStripX, y, GROUP_STRIP_WIDTH, height);\n }\n }\n\n ctx.fillStyle = '#666';\n ctx.fill();\n}\n\n/**\n * Exported for testing don't use directly\n * Walks the tree and computes coordinates, dimensions and other data needed for rendering. For each item in the tree\n * it defers the rendering to the renderFunc.\n */\nexport function walkTree(\n root: LevelItem,\n // In sandwich view we use parents direction to show all callers.\n direction: 'children' | 'parents',\n data: FlameGraphDataContainer,\n totalViewTicks: number,\n rangeMin: number,\n rangeMax: number,\n wrapperWidth: number,\n collapsedMap: CollapsedMap,\n renderFunc: RenderFuncWrap\n) {\n // The levelOffset here is to keep track if items that we don't render because they are collapsed into single row.\n // That means we have to render next items with an offset of some rows up in the stack.\n const stack: Array<{ item: LevelItem; levelOffset: number }> = [];\n stack.push({ item: root, levelOffset: 0 });\n\n const pixelsPerTick = (wrapperWidth * window.devicePixelRatio) / totalViewTicks / (rangeMax - rangeMin);\n let collapsedItemRendered: LevelItem | undefined = undefined;\n\n while (stack.length > 0) {\n const { item, levelOffset } = stack.shift()!;\n let curBarTicks = item.value;\n const muted = curBarTicks * pixelsPerTick <= MUTE_THRESHOLD;\n const width = curBarTicks * pixelsPerTick - (muted ? 0 : BAR_BORDER_WIDTH * 2);\n const height = PIXELS_PER_LEVEL;\n\n if (width < HIDE_THRESHOLD) {\n // We don't render nor it's children\n continue;\n }\n\n let offsetModifier = 0;\n let skipRender = false;\n const collapsedItemConfig = collapsedMap.get(item);\n const isCollapsedItem = collapsedItemConfig && collapsedItemConfig.collapsed;\n\n if (isCollapsedItem) {\n if (collapsedItemRendered === collapsedItemConfig.items[0]) {\n offsetModifier = direction === 'children' ? -1 : +1;\n skipRender = true;\n } else {\n // This is a case where we have another collapsed group right after different collapsed group, so we need to\n // reset.\n collapsedItemRendered = undefined;\n }\n } else {\n collapsedItemRendered = undefined;\n }\n\n if (!skipRender) {\n const barX = getBarX(item.start, totalViewTicks, rangeMin, pixelsPerTick);\n const barY = (item.level + levelOffset) * PIXELS_PER_LEVEL;\n\n let label = data.getLabel(item.itemIndexes[0]);\n if (isCollapsedItem) {\n collapsedItemRendered = item;\n }\n\n renderFunc(item, barX, barY, width, height, label, muted);\n }\n\n const nextList = direction === 'children' ? item.children : item.parents;\n if (nextList) {\n stack.unshift(...nextList.map((c) => ({ item: c, levelOffset: levelOffset + offsetModifier })));\n }\n }\n}\n\nfunction useColorFunction(\n totalTicks: number,\n totalTicksRight: number | undefined,\n colorScheme: ColorScheme | ColorSchemeDiff,\n theme: GrafanaTheme2,\n mutedColor: string,\n rangeMin: number,\n rangeMax: number,\n matchedLabels: Set<string> | undefined,\n topLevel: number\n) {\n return useCallback(\n function getColor(item: LevelItem, label: string, muted: boolean) {\n // If collapsed and no search we can quickly return the muted color\n if (muted && !matchedLabels) {\n // Collapsed are always grayed\n return mutedColor;\n }\n\n const barColor =\n item.valueRight !== undefined &&\n (colorScheme === ColorSchemeDiff.Default || colorScheme === ColorSchemeDiff.DiffColorBlind)\n ? getBarColorByDiff(item.value, item.valueRight!, totalTicks, totalTicksRight!, colorScheme)\n : colorScheme === ColorScheme.ValueBased\n ? getBarColorByValue(item.value, totalTicks, rangeMin, rangeMax)\n : getBarColorByPackage(label, theme);\n\n if (matchedLabels) {\n // Means we are searching, we use color for matches and gray the rest\n return matchedLabels.has(label) ? barColor.toHslString() : mutedColor;\n }\n\n // Mute if we are above the focused symbol\n return item.level > topLevel - 1 ? barColor.toHslString() : barColor.lighten(15).toHslString();\n },\n [totalTicks, totalTicksRight, colorScheme, theme, rangeMin, rangeMax, matchedLabels, topLevel, mutedColor]\n );\n}\n\nfunction useSetupCanvas(canvasRef: RefObject<HTMLCanvasElement>, wrapperWidth: number, numberOfLevels: number) {\n const [ctx, setCtx] = useState<CanvasRenderingContext2D>();\n\n useEffect(() => {\n if (!(numberOfLevels && canvasRef.current)) {\n return;\n }\n const ctx = canvasRef.current.getContext('2d')!;\n\n const height = PIXELS_PER_LEVEL * numberOfLevels;\n canvasRef.current.width = Math.round(wrapperWidth * window.devicePixelRatio);\n canvasRef.current.height = Math.round(height);\n canvasRef.current.style.width = `${wrapperWidth}px`;\n canvasRef.current.style.height = `${height / window.devicePixelRatio}px`;\n\n ctx.textBaseline = 'middle';\n ctx.font = 12 * window.devicePixelRatio + 'px monospace';\n ctx.strokeStyle = 'white';\n setCtx(ctx);\n }, [canvasRef, setCtx, wrapperWidth, numberOfLevels]);\n return ctx;\n}\n\n// Renders a text inside the node rectangle. It allows setting alignment of the text left or right which takes effect\n// when text is too long to fit in the rectangle.\nfunction renderLabel(\n ctx: CanvasRenderingContext2D,\n data: FlameGraphDataContainer,\n label: string,\n item: LevelItem,\n width: number,\n x: number,\n y: number,\n textAlign: TextAlign\n) {\n ctx.save();\n ctx.clip(); // so text does not overflow\n ctx.fillStyle = '#222';\n\n const displayValue = data.valueDisplayProcessor(item.value);\n const unit = displayValue.suffix ? displayValue.text + displayValue.suffix : displayValue.text;\n\n // We only measure name here instead of full label because of how we deal with the units and aligning later.\n const measure = ctx.measureText(label);\n const spaceForTextInRect = width - BAR_TEXT_PADDING_LEFT;\n\n let fullLabel = `${label} (${unit})`;\n let labelX = Math.max(x, 0) + BAR_TEXT_PADDING_LEFT;\n\n // We use the desired alignment only if there is not enough space for the text, otherwise we keep left alignment as\n // that will already show full text.\n if (measure.width > spaceForTextInRect) {\n ctx.textAlign = textAlign;\n // If aligned to the right we don't want to take the space with the unit label as the assumption is user wants to\n // mainly see the name. This also reflects how pyro/flamegraph works.\n if (textAlign === 'right') {\n fullLabel = label;\n labelX = x + width - BAR_TEXT_PADDING_LEFT;\n }\n }\n\n ctx.fillText(fullLabel, labelX, y + PIXELS_PER_LEVEL / 2 + 2);\n ctx.restore();\n}\n\n/**\n * Returns the X position of the bar. totalTicks * rangeMin is to adjust for any current zoom. So if we zoom to a\n * section of the graph we align and shift the X coordinates accordingly.\n * @param offset\n * @param totalTicks\n * @param rangeMin\n * @param pixelsPerTick\n */\nexport function getBarX(offset: number, totalTicks: number, rangeMin: number, pixelsPerTick: number) {\n return (offset - totalTicks * rangeMin) * pixelsPerTick;\n}\n"],"names":["ctx"],"mappings":"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"}