Flame graph

import WestCoastCharts from 'west-coast-charts'
import types from 'west-coast-charts/types'

WestCoastCharts.use(types)

const options = {
  chart: {
    height: 380,
    fontFamily: "Inter, Geist, \"IBM Plex Sans\", system-ui, sans-serif",
    type: "icicle",
    toolbar: {
      show: false
    }
  },
  series: [
    {
      name: "Samples",
      data: [
        {
          x: "main",
          children: [
            {
              x: "handle_request",
              children: [
                {
                  x: "parse_json",
                  y: 120
                },
                {
                  x: "auth.verify",
                  children: [
                    {
                      x: "crypto.hmac",
                      y: 80
                    },
                    {
                      x: "cache.get",
                      y: 30
                    }
                  ]
                },
                {
                  x: "db.query",
                  children: [
                    {
                      x: "pool.acquire",
                      y: 40
                    },
                    {
                      x: "socket.read",
                      y: 160
                    }
                  ]
                },
                {
                  x: "render",
                  children: [
                    {
                      x: "template.eval",
                      y: 90
                    },
                    {
                      x: "escape_html",
                      y: 25
                    }
                  ]
                }
              ]
            },
            {
              x: "gc",
              y: 60
            },
            {
              x: "log.flush",
              y: 35
            }
          ]
        }
      ]
    }
  ],
  plotOptions: {
    icicle: {
      direction: "up",
      sort: "name",
      colorBy: "name",
      borderRadius: 2,
      spacing: 1,
      dataLabels: {
        align: "left",
        minSizeToShow: 24,
        style: {
          fontSize: "11px"
        }
      }
    }
  },
  title: {
    text: "CPU samples per function"
  },
  theme: {
    mode: "light",
    preset: "coastal"
  }
}

const chart = new WestCoastCharts(document.querySelector('#chart'), options)
await chart.render()