Question

我正在尝试使用puppeteer监视CPU使用率。我可以找到一些用于页面加载测量和堆测量的相关解决方案，但是没有什么可以看到页面生命周期内的CPU利用率，不仅是页面加载时。

dev-tools / Performance monitor 下的chrome中提供了与以下信息相同的信息： “ CPU使用率”

Answer 1

仔细阅读代码并认为我会分享，因为这种解释似乎没有出现在任何地方。

看起来devtools中的相关代码在这里： https://source.chromium.org/chromium/chromium/src/+/main:out/Debug/gen/third_party/devtools-frontend/src/front_end/core/sdk/PerformanceMetricsModel.js;l=43?q=requestMetrics&ss=chromium%2Fchromium%2Fsrc

case "CumulativeTime" /* CumulativeTime */:
    value = (data.lastTimestamp && data.lastValue) ?
        Platform.NumberUtilities.clamp((metric.value - data.lastValue) * 1000 / (timestamp - data.lastTimestamp), 0, 1) :
        0;
    data.lastValue = metric.value;
    data.lastTimestamp = timestamp;
    break;

Devtools 正在轮询指标，这些指标似乎包含自启用指标以来在任务上花费的累积时间。 CPU 使用率是自上次指标请求以来所有任务所用时间的百分比。

记录 CPU 使用率随时间变化的示例代码：

interface CPUUsageSnapshot {
  timestamp: number,
  usage: number,
}

export interface CPUStats {
  average: number,
  snapshots: CPUUsageSnapshot[]
}

function processMetrics(metrics: GetMetricsResponse): {
  timestamp: number,
  activeTime: number
} {
  const activeTime = metrics.metrics.filter(m => m.name.includes("Duration")).map(m => m.value).reduce((a, b) => a + b)
  return {
    timestamp: metrics.metrics.find(m => m.name === "Timestamp")?.value || 0,
    activeTime
  }
}

async function logMetrics(cdp: CDPSession, interval: number): Promise<() => Promise<CPUStats>> {
  await cdp.send("Performance.enable", {
    timeDomain: "timeTicks"
  })

  const { timestamp: startTime, activeTime: initialActiveTime } = processMetrics(await cdp.send("Performance.getMetrics"))
  const snapshots: CPUUsageSnapshot[] = []
  let cumulativeActiveTime = initialActiveTime

  let lastTimestamp = startTime
  const timer = setInterval(async () => {
    const {timestamp, activeTime} = processMetrics(await cdp.send("Performance.getMetrics"))
    const frameDuration = timestamp - lastTimestamp
    let usage = (activeTime - cumulativeActiveTime) / frameDuration
    cumulativeActiveTime = activeTime

    if (usage > 1) usage = 1
    snapshots.push({
      timestamp,
      usage
    })

    lastTimestamp = timestamp
  }, interval)

  return async () => {
    clearInterval(timer)
    await cdp.send("Performance.disable")

    return {
      average: cumulativeActiveTime / (lastTimestamp - startTime),
      snapshots
    }
  }
}

puppeteer：有没有一种方法可以衡量页面cpu的使用情况

1 个答案: