ChromeDevTools timeline events

ChromeDevToolsTimlineEvents.js

// https://github.com/ChromeDevTools/devtools-frontend/blob/1061a013745d1f638b1f989204886232fd5a835a/front_end/panels/timeline/TimelineUIUtils.ts
// https://docs.google.com/document/d/1CvAClvFfyA5R-PhYUmn5OOQtYMH4h6I0nSsKchNAySU/preview
// as info https://github.com/GoogleChrome/lighthouse/blob/7ae8bd442d83efcca1cb48c5c48302d974b00756/core/lib/tracehouse/task-groups.js#L26
export const taskGroups = {
  painting: {
    id: 'painting',
    label: 'Painting',
    traceEventNames: [
      "PaintSetup",
      "Paint",
      "RasterTask",
      "Commit",
      "CompositeLayers",
      "DecodeImage",
      "ResizeImage",
    ],
    hiddenFromResult: [
      "MarkFirstPaint",
      "PaintImage",
      "UpdateLayer",
    ]
  },
  rendering: {
    id: 'rendering',
    label: 'Rendering',
    traceEventNames: [
      "Animation",
      "HitTest",
      "ScheduleStyleRecalculation",
      "RecalculateStyles",
      "UpdateLayoutTree",
      "Layerize",
      "Layout",
      "UpdateLayerTree",
      "PrePaint",
      "ScrollLayer",
      "ComputeIntersections",
    ],
    hiddenFromResult: [
      "MarkFCP",
      "MarkLCPCandidate",
      "InvalidateLayout",
      "RequestMainThreadFrame",
      "BeginFrame",
      "BeginMainThreadFrame",
      "DrawFrame",
    ]
  },
  scripting: {
    id: 'scripting',
    label: 'Scripting',
    traceEventNames: [
      "EventDispatch",
      "TimerInstall",
      "TimerRemove",
      "TimerFire",
      "XHRReadyStateChange",
      "XHRLoad",
      "CompileScript",
      "CacheScript",
      "CompileCode",
      "OptimizeCode",
      "EvaluateScript",
      "CompileModule",
      "CacheModule",
      "EvaluateModule",
      "StreamingCompileScriptParsing",
      "BackgroundDeserialize",
      "WasmStreamFromResponseCallback",
      "WasmCompiledModule",
      "WasmCachedModule",
      "WasmModuleCacheHit",
      "WasmModuleCacheInvalid",
      "TimeStamp",
      "ConsoleTime",
      "UserTiming",
      "RunMicrotasks",
      "FunctionCall",
      "GCEvent",
      "MajorGC",
      "MinorGC",
      "JSFrame",
      "RequestAnimationFrame",
      "CancelAnimationFrame",
      "FireAnimationFrame",
      "RequestIdleCallback",
      "CancelIdleCallback",
      "FireIdleCallback",
      "WebSocketCreate",
      "WebSocketSendHandshakeRequest",
      "WebSocketReceiveHandshakeResponse",
      "WebSocketDestroy",
      "EmbedderCallback",
      "GCCollectGarbage",
      "CryptoDoEncrypt",
      "CryptoDoEncryptReply",
      "CryptoDoDecrypt",
      "CryptoDoDecryptReply",
      "CryptoDoDigest",
      "CryptoDoDigestReply",
      "CryptoDoSign",
      "CryptoDoSignReply",
      "CryptoDoVerify",
      "CryptoDoVerifyReply"
    ],
    hiddenFromResult: [
      "MarkLoad",
      "MarkDOMContent",
    ]
  },
  other: {
    id: 'other',
    label: 'Other',
    traceEventNames: [
      "Task",
      "Program",
      "StartProfiling",
      "StreamingCompileScript",
      "FinalizeDeserialization",
    ],
    hiddenFromResult: [
      "JSSystemFrame"
    ]
  },
  loading: {
    id: 'loading',
    label: 'Loading',
    traceEventNames: [
      "ParseHTML",
      "ParseAuthorStyleSheet",
      "ResourceWillSendRequest",
      "ResourceSendRequest",
      "ResourceReceiveResponse",
      "ResourceFinish",
      "ResourceReceivedData",
    ],
    hiddenFromResult: [
      "FrameStartedLoading",
    ]
  },
  idle: {
    id: 'idle',
    label: 'Idle',
    traceEventNames: [
      "StreamingCompileScriptWaiting"
    ],
    hiddenFromResult: [
      "JSIdleFrame",
    ]
  },
  gpu: {
    id: 'gpu',
    label: 'GPU',
    traceEventNames: [
      "GPUTask"
    ],
    hiddenFromResult: []
  },
  experience: {
    id: 'experience',
    label: 'Experience',
    traceEventNames: [
      "LayoutShift",
      "EventTiming",
    ],
    hiddenFromResult: []
  },
  async: {
    id: 'async',
    label: 'Async',
    traceEventNames: [
      "AsyncTask",
    ],
    hiddenFromResult: []
  }
}