`lighthouse-ci` 中的分数是什么意思？

Question

我们正在使用 lighthouse-ci 在 CircleCI 构建后在我们的网站上运行自动 Lighthouse 检查。我们的

lighthouserc.json

配置非常基本，主要使用默认值：

{
  "ci": {
    "collect": {
      "url": [
        // Three URLs
      ],
      "numberOfRuns": 3
    },

    "upload": {
      "target": "temporary-public-storage"
    },

    "assert": {
      "assertions": {
        "categories:performance": ["warn", {"minScore": 0.4}],
        "categories:accessibility": ["error", {"minScore": 0.8}],
        "cumulative-layout-shift": ["error", {}],
        "first-contentful-paint": ["warn", {}],
        "first-meaningful-paint": ["warn", {}],
        "largest-contentful-paint": ["warn", {}],
        "speed-index": ["warn", {}],
        "interactive": ["warn", {}]
      }
    }
  }
}

但是，我对在 CircleCI 输出中看到的结果感到困惑，例如：

  ✘  cumulative-layout-shift failure for minScore assertion
       Cumulative Layout Shift
       https://web.dev/articles/cls

        expected: >=0.9
           found: 0.89
      all values: 0.89, 0.22, 0.22

The Lighthouse docs 表示 0.1 或更低是累积布局偏移的良好分数。大概这个测试失败了，因为我们在三个不同的运行中得到了 0.89、0.22 和 0.22，而不是 0.1。但我不明白这里的

>=0.9

是什么意思。当然应该说

<=0.1

？

Answer 1

是的，我承认这有点令人困惑。

CLS 指标有一个分数，其中 <= 0.1 is considered "good" and > 0.25 被认为“不好”（介于两者之间的其他所有内容都被认为“需要改进”）。

但是，Lighthouse 对所有审核的评分从

0

（“失败”）到

1

（通过）。

因此，Lighthouse 审核有两次“分数”，如本例所示：

        "cumulative-layout-shift": {
            "id": "cumulative-layout-shift",
            "title": "Cumulative Layout Shift",
            "description": "Cumulative Layout Shift measures the movement of visible elements within the viewport. [Learn more about the Cumulative Layout Shift metric](https://web.dev/articles/cls).",
            "score": 1,
            "scoreDisplayMode": "numeric",
            "numericValue": 0.004931168836415721,
            "numericUnit": "unitless",
            "displayValue": "0.005",
            "scoringOptions": {
                "p10": 0.1,
                "median": 0.25
            },

在此示例中，CLS 分数（或 Lighthouse 为避免混淆而称其为“值”）为 0.005。但 Lighthouse 对此审核的“分数”是

1

（表明审核已通过，结果为 0.005 <= 0.1 and so the CLS score is "good").

您可以在此处看到在值和 Lighthouse 得分之间进行转换的代码，基于传递给该函数的

p10

和

median

评分选项（分别为 0.1 和 0.25）：

  /**
   * Computes a score between 0 and 1 based on the measured `value`. Score is determined by
   * considering a log-normal distribution governed by two control points (the 10th
   * percentile value and the median value) and represents the percentage of sites that are
   * greater than `value`.
   *
   * Score characteristics:
   * - within [0, 1]
   * - rounded to two digits
   * - value must meet or beat a controlPoint value to meet or exceed its percentile score:
   *   - value > median will give a score < 0.5; value ≤ median will give a score ≥ 0.5.
   *   - value > p10 will give a score < 0.9; value ≤ p10 will give a score ≥ 0.9.
   * - values < p10 will get a slight boost so a score of 1 is achievable by a
   *   `value` other than those close to 0. Scores of > ~0.99524 end up rounded to 1.
   * @param {{median: number, p10: number}} controlPoints
   * @param {number} value
   * @return {number}
   */
  static computeLogNormalScore(controlPoints, value) {
    return Util.computeLogNormalScore(controlPoints, value);
  }

您可以看到此功能在此处的 CLS 灯塔审核中使用。