export function createLongTaskSpans()

in packages/rum-core/src/performance-monitoring/metrics/metrics.js [67:125]

• 30 lines of code
• 5 McCabe index (conditional complexity)

export function createLongTaskSpans(longtasks, agg) {
  const spans = []

  for (let i = 0; i < longtasks.length; i++) {
    /**
     * name of the long task can be any one of the type listed here
     * depeding on the origin of the longtask
     * https://w3c.github.io/longtasks/#sec-PerformanceLongTaskTiming
     */
    const { name, startTime, duration, attribution } = longtasks[i]
    const end = startTime + duration
    const span = new Span(`Longtask(${name})`, LONG_TASK, { startTime })
    agg.count++
    agg.duration += duration
    agg.max = Math.max(duration, agg.max)

    /**
     * use attribution data to figure out the culprits of the longtask
     * https://w3c.github.io/longtasks/#sec-TaskAttributionTiming
     *
     * Based on the same-origin policy, we can figure out the culprit from
     * the attribution data
     */
    if (attribution.length > 0) {
      const { name, containerType, containerName, containerId } = attribution[0]

      /**
       * name - identifies the type of work responsible for the long task
       * such as `unknown`, `script`, `layout`
       *
       * containerType - type of the culprit browsing context container such as
       * 'iframe', 'embed', 'object' or 'window'
       *
       * Based on the container type, the name, id and src would be populated in
       * the respective fields when available or empty string (ex: If iframe
       * type caused the longtask, id and name of the Iframe would be populated)
       *
       * `containerSrc` is not used as it could be large url/blob and it would
       * increase the payload size, showing id/name would be enough to asosicate the origin
       */
      const customContext = {
        attribution: name,
        type: containerType
      }
      if (containerName) {
        customContext.name = containerName
      }
      if (containerId) {
        customContext.id = containerId
      }
      span.addContext({
        custom: customContext
      })
    }
    span.end(end)
    spans.push(span)
  }
  return spans
}