AutoWebPerf

Autowebperf（AWP）

Autowebperf提供了一个灵活且可扩展的框架，用于使用WebPagetest和Pages -Peedinsights（PagesPeedInsights）的任意审核工具运行Web性能审核。该库使开发人员能够始终如一地收集指标，并将指标存储到首选的数据存储中，例如本地JSON文件，Google表，BigQuery或内部SQL数据库。

查看https://web.dev/autowebperf进行介绍。

它如何工作

Autowebperf从任意数据存储平台中获取测试列表，例如本地JSON，Google Sheets，BigQuery或自托管SQL数据库。通过测试列表，它根据每种测试配置执行审核，将各个数据源的指标收集到结果列表中。

通过测量工具（例如WebPagetest）进行审核的过程是在单个Gainter中定义的。使用数据平台（例如本地JSON）读取和写作的逻辑是在连接器中实现的。

功能亮点

• 可以插入任何平台的Web审核自动化库，例如Google Sheeets，GCP App Engine或仅将其写入JSON文件的CRON作业。
• 提供具有可自定义频率（例如每日，每周，每月等），网络条件和其他审核配置等的重复测试的能力。
• 公制收集器被设计为与输出数据格式和自动化逻辑分离的模块。
• 连接器模块旨在读取测试列表并将审核结果写入特定的数据格式或平台。例如，CSV文件的连接器。 （有关详细信息，请参见src/connectors/csv-connector ）

这与Google的其余速度测量工具相比如何？

Autowebperf充当性能审核聚合器，通过多种速度测量工具（包括WebPagetest，Pages -Pages -Peedinsights和Chrome UX报告）自动化性能审核和指标的过程。当每个单独的速度测量工具提供审核指标时，Autowebperf汇总了结果并将其写入任何首选的数据存储平台，例如本地JSON，基于云的数据库或GoogleSheets。

Quickstart

首先，克隆AWP回购并运行NPM安装：

 git clone https://github.com/GoogleChromeLabs/AutoWebPerf.git
npm install

完成后，通过以下命令运行单个测试来检查安装：

 ./awp run examples/tests.json output/results.json

此命令使用examples/tests.json中的示例文件，并将结果返回到output/results.json 。

要开始重复进行测试，您需要在测试文件中包含一个recurring.frequency属性，并在测试文件中设置下一个触发器。要设置下一个触发时间并运行一次性测试，请在添加recurring.frequency属性后使用此命令：

 ./awp recurring examples/tests-recurring.json output/results.json

如果成功的话，触发时间将对您选择的频率进行更新，并且结果将被写入output/results.json 。

一旦正确设置了触发时间，您就可以在下一个triger时间内使用continue命令进行测试自动运行：

 ./awp continue examples/tests-recurring.json output/results.json

这将自动以指定的频率运行每个测试。请参见下面的“运行重复测试”部分的更多信息。

更多例子

单个URL：通过PagesPeedInsights测试单个URL：

 ./awp run url:https://www.thinkwithgoogle.com/ json:output/results.json

选择Galether：测试一个带有特定收集者（例如PagesPeedInsights或WebPagetest）的URL：

 ./awp run --gatherers=psi url:https://web.dev json:output/results.json

CSV文件：运行在CSV文件中定义的测试并将结果写入JSON文件：

 ./awp run csv:examples/tests.csv json:output/results.json

PAGESPEEDINSIGHTS API：使用API​​密钥运行PagesPeedInsights测试：

 PSI_APIKEY=SAMPLE_KEY ./awp run examples/tests.json output/results.json

WebPagetest API：运行WebPagetest测试：

 WPT_APIKEY=SAMPLE_KEY ./awp run examples/tests-wpt.json output/results.json

覆盖与附加：要在输出文件中运行测试并覆盖现有结果

 ./awp run examples/tests.json output/results.json --override-results

可用的收集者：

• WebPagetest-有关详细信息，请参见DOCS/WEBPAGETEST.MD。
• PagesPeed Insights-有关详细信息，请参见DOCS/PSI.MD。
• Chrome UX报告API-有关详细信息，请参见DOCS/CRUXAPI.MD。
• Chrome UX报告BigQuery-有关详细信息，请参见Docs/Cruxbigquery.md。

可用连接器：

• JSON连接器 - 读取或写入本地JSON文件。如果未指定conenctor名称，这是默认连接器。例如：

 ./awp run examples/tests.json output/results.json

另外，要指定使用JSON连接器进行Tests路径和Results路径：

 ./awp run json:/examples/tests.json json:output/results.json

• CSV连接器 - 读取或写入本地CSV文件。要使用CSV连接器进行Tests路径和Results路径：

 ./awp run csv:/examples/tests.csv csv:output/results.csv

• URL连接器 - 仅生成一个带有特定URL审核的Test 。仅使用一个特定URL的一个Test进行审核：

 ./awp run url:https://example.com csv:output/results.csv

请注意，此连接器仅适用于Tests路径，而不是Results路径。

• 有关详细的指导，Google Shees Connector Connector请参阅Docs/Sheets-connector.md。

将AWP与节点CLI一起使用

运行测试

您可以随时运行以下打印CLI用法：

 ./awp --help

要运行测试，您可以使用给定的测试JSON运行以下CLI命令，例如examples/tests.json ，其中包含一系列测试。您可以查看examples/tests.json测试数据结构。

 ./awp run examples/tests.json output/results.json

这将在给定的results.json路径中生成结果对象。

默认情况下，AWP将使用JSON作为阅读测试和写作结果的默认连接器。另外，您可以以<connector>:<path> 。

例如，运行在CSV中定义的测试并在JSON中写入结果：

 ./awp run csv:examples/tests.csv json:output/results.csv

检索测试结果

对于某些审核平台，例如WebPagetest，每个测试可能需要几分钟才能获取实际结果。对于这些类型的异步审核，每个结果都将保持在“提交”状态。您需要以后明确检索结果。

运行以下内容以检索results.json中结果的最终指标。

 ./awp retrieve examples/tests.json output/results.json

这将获取所有审核平台的指标，并在output/results.json中更新结果对象。您可以查看examples/results.json有关结果对象中的详细信息。

运行重复测试

如果您想设置重复的测试，则可以定义包含该测试frequency的recurring对象。

 ./awp recurring examples/tests-recurring.json output/results.json

这将在results.json中生成结果对象tests.json例如，更新的测试对象看起来如下，并带有更新的nextTriggerTimestamp 。

 {
  "label": "web.dev",
  "url": "https://web.dev",
  "recurring": {
    "frequency": "Daily",
    "nextTriggerTimestamp": 1599692305567,
    "activatedFrequency": "Daily"
  },
  "psi": {
    "settings": {
      "locale": "en-GB",
      "strategy": "mobile"
    }
  }
}

nextTriggerTimestamp将根据以前的时间戳更新到第二天。这是为了防止相同的测试重复运行，并确保该测试每天仅执行一次。

设置Cron工作以进行重复测试

在大多数UNIX式操作系统中，您可以设置一个CRON作业以定期运行AWP CLI。

例如，在MacOS中，您可以运行以下命令来通过AWP设置每日CRON作业：

 # Edit the cronjob with a text editor.
EDITOR=nano crontab -e

将以下行添加到crontab中，以在中午12:00进行每日跑步。请注意，这是基于运行AWP的系统时间。

 0 12 * * * PSI_APIKEY=SAMPLE_KEY cd ~/workspace/awp && ./awp run examples/tests.json csv:output/results-recurring.csv

运行扩展测试

扩展程序是一个模块，可帮助AWP通过其他过程和计算运行测试。例如， budgets扩展可以添加绩效预算并计算目标和结果指标之间的三角洲。

运行扩展：

 ./awp run examples/tests.json output/results.json --extensions=budgets

测试和结果

定义测试

测试列表只是一系列测试对象，例如以下样本测试。或查看src/examples/tests.js以获取测试列表的详细示例。

 [{
  "label": "Test-1",
  "url": "example1.com",
  "webpagetest": {
    ...
  }
}, {
  "label": "Test-2",
  "url": "example2.com",
  "psi": {
    ...
  }
}]

每个Test对象都定义了通过定义gatherers属性进行的审核。例如，第一个Test具有webpagetest属性，该属性定义了运行WebPagetest审核的配置。第二个Test具有psi属性，该属性定义了如何运行PagesSpeedInsights审核。

生成结果

运行测试后，如下所示， Results列表。每个Result都包含其相应的指标与预定义的gatherers ，例如WebPagetest和Pages -PeedInsights。请参见下面的示例。

 [{
  "label": "Test-1",
  "url": "example1.com",
  "webpagetest": {
    "metrics": {
      FirstContentfulPaint: 900,
      ...
    }
  }  
}, {
  "label": "Test-2",
  "url": "example2.com",
  "psi": {
    "metrics": {
      FirstContentfulPaint: 900,
      ...
    }
  }  
}]

环境变量

一些连接器或收集者可能需要一个或多个环境变量，例如API键或服务帐户的途径。例如，使用CRUX API收集器运行需要CRUX API键。

要通过CLI中的环境变量，请使用环境的常规使用var运行命令：

 CRUX_APIKEY=<YOUR_KEY> ./awp run url:https://wev.dev/ json:output/results.json

收集者

AWP支持以下审计收集者。请查看相应的文档以获取详细信息。

WebPagetest

WebPagetest Gatherer通过公共WebPagetest端点或自定义的私有WebPagetest实例运行测试。

有关使用WebPagetest Gatherer的更多详细信息，请参见DOCS/WEBPAGETEST.MD。

PagesPeed Insights

PagesPeed Insights Chapterer通过公共PagesPeed Insights API进行测试。

有关PSI Gatherer使用的更多详细信息，请参见Docs/PSI.MD。

Chrome UX报告API（CRUX API）

CRUX API收集者通过Chrome UX报告API收集性能指标。

有关使用CRUX API收集者的更多详细信息，请参见Docs/Cruxapi.md。

Chrome UX报告历史（通过BigQuery的关键）

Crux BigQuery Gatherer通过其公共Google BigQuery项目通过Chrome UX报告收集性能指标。请否您需要设置一个Google Cloud项目才能查询公共BigQuery表。

有关使用CRUX API GATHICER的更多详细信息，请参见Docs/Cruxbigquery.md。

设计

AWP采用模块设计，包括用于使用WebPagetest，Pages -PeedInsights或其他工具进行审核的模块，以及用于从JSON，Googlesheets或Cloud Service等数据平台读取/编写数据的模块。

在高级视图中，有三种模块：

• 收集者- 收集者进行审核并生成指标。
• 连接器- 连接器将读取测试配置并将结果写入数据平台，例如本地JSON文件或Google表格。
• 扩展名- 扩展名在运行审核之前或之后添加了其他指标或信息。

AWP引擎使用两个主要的JavaScript对象结构来运行审核和收集指标。

• 测试- 一个包含一个测试任务的审核配置的对象，例如URL，审计方法或扩展配置。您可以参考examples/tests.json的实际测试对象。
• 结果- 包含审核配置，指标和整体状态的对象。您可以参考examples/results.json 。

审核步骤

为了处理诸如WebPagetest之类的异步审核工具，AWP将审核周期分为动作的三个步骤：

• 运行- 此操作获取Tests列表，并生成Results对象的列表。
• 重复出现- 类似于运行，此操作采用了Tests列表，生成Results列表，并为每个重复Test更新NextTriggerTimestamp。当使用定期或基于计时器的任务（例如Cron Job）运行时，此操作很有用。
• 检索- 此操作扫描结果列表，并在结果未Retrieved到状态时收集指标。

AWP配置

要设置模块及其配置，需要作为JavaScript对象进行整体AWP配置。

AWP配置具有以下所需属性：

• connector ：连接器的名称。
• helper ：特定连接器的助手，包括API处理程序和其他助手功能，将用于收集器和扩展。
• dataSources ：一系列审核源，例如webpagetest或psi 。每个数据源都需要在src/gatherers文件夹中具有相应的Gatherer文件。
• extensions ：一系列扩展。每个扩展名都需要在src/extensions中具有相应的扩展文件。

其他可选属性：

• verbose ：是否打印详细消息。
• debug ：是否打印调试消息。

以下配置示例来自examples/awp-config.js ：

 {
  connector: 'JSON',
  helper: 'Node',
  dataSources: ['webpagetest'],
  json: { // Config for JSON Connector.
    tests: 'tests.json',
    results: 'results.json',
  },
  extensions: [
    'budgets',
  ],
  budgets: { // Config for Budgets extension.
    dataSource: 'webpagetest',
  },
  verbose: true,
  debug: false,
}

使用上面的示例配置，它将使用JSON连接器，该连接器将读取和写入测试和结果作为JSON文件。请参阅examples/tests.json和examples/results.json 。

除了基本属性外，模块还使用了一些其他属性：

• json属性作为JSONCONNECTOR的配置。
• budgets财产作为预算发行的配置

使用Autowebperf Core

创建AWP新实例的示例：

 let awp = new AutoWebPerf({
  connector: 'JSON',
  helper: 'Node',
  dataSources: ['webpagetest'],
  extensions: extensions,
  json: { // Config for JSON connector.
    tests: argv['tests'],
    results: argv['results'],
  },
  verbose: verbose,
  debug: debug,
});

提交所有测试：

 awp.run();

要使用过滤器提交特定的测试：这将运行具有ID = 1并选择= True属性的测试。

 awp.run({
  filters: ['id="1"', 'selected'],
});

要检索所有待处理结果，请用状态过滤！==“检索”。

 awp.retrieve({
  filters: ['status!=="Retrieved"'],
});

• 有关图案缩写器的更高级用法，请查看提供更多示例的src/utils/pattern-filter.js 。

进行重复测试：

 // This will run the actual audit and update the nextTriggerTimestamp.
awp.recurring();

进行特定扩展的测试：

 // This will override the extension list defined in the awpConfig.
awp.run({
  extensions: ['budgets']
})

收集者模块

GATHERER类扩展了src/gatherers/gatherer.js并覆盖以下方法：

• constructor(config, apiHelper, options) ：

  • config ：在属性中定义的配置，并在AWP配置中使用此Gainterer的名称。一些审核工具（例如WebPagetest或Pages -PeedInsights）需要API键。 GATHERER的API密钥位于config.apiKey中。
  • options ：其他设置，例如verbose和debug 。

• run(test, options) ：

  • test ：此审核运行的Test对象。该收集者所需的数据（例如设置或元数据）将以收集者的名字在属性中。例如，WebPagetest的数据将在此Test对象的webpagetest中。
  • options ：其他设置。

• retrieve(result, options) ：

  • result ：使用指标的Result对象。此Gatherer所需的数据将以收集者的名字列入该物业。例如，数据和指标将在此Result对象的webpagetest中。
  • options ：其他设置，例如verbose和debug 。

连接器模块

连接器类扩展src/connectors/connector.js并覆盖以下方法：

• constructor(config, apiHandler) ：

  • config ：在AWP配置中使用此连接器名称的属性定义的配置。
  • apiHandler ：用于拨打API调用的API处理程序实例。

• getConfig() ：返回连接器的附加配置对象的方法。此配置对象取决于此连接器在哪里存储其其他设置，包括用于收集器的API键。例如，JSONCONNECTOR使用tests.json ，并从config属性中读取其他设置，包括每个Gainterers的API键。

• getTestList(options) ：返回Tests列表作为数组的方法。

• updateTestList(newTests, options) ：给定Tests列表，更新Tests列表的方法。

• getResultList(options) ：返回Results列表作为数组的方法。

• appendResultList(newResults, options) ：将新Results附加到当前Results列表末尾的方法。

• updateResultList(newResults, options) ：更新当前Results列表中现有Results的方法。

扩展模块

扩展类扩展src/extensions/extension.js并覆盖以下方法：

• constructor(config) ：
  • config ：在属性中定义的配置，并在AWP配置中使用此扩展名称。
• beforeRun(context) ：执行Test运行步骤之前的方法。
  • context.test ：相应的Test对象。
• afterRun(context) ：执行Test的运行步骤后的方法。
  • context.test ：相应的Test对象。
  • context.result ：相应的Result对象。
• beforeAllRuns(context) ：执行运行步骤之前的方法。
  • context.tests ：此运行中的所有Test对象。
• afterAllRuns(context) ：执行运行步骤后的方法。
  • context.tests ：此运行中的所有Test对象。
  • context.results ：此运行中的所有Result对象。
• beforeRetrieve(context) ：执行Result检索步骤之前的方法。
  • context.result ：相应的Result对象。
• afterRetrieve(context) ：执行Result的方法后的方法。
  • context.result ：相应的Result对象。
• beforeAllRetrieves(context) ：执行检索步骤之前的方法。
  • context.result ：相应的Result对象。
• afterAllRetrieves(context) ：执行检索步骤后的方法。
  • context.result ：相应的Result对象。

测试对象

标准Test对象包含以下属性：

（您可以参考examples/tests.json 。）

• selected ：是否要执行此Test 。
• label ：此Test的名称。
• url ：URL审计。
• recurring ：重复审核的设置。
  • frequency ： src/common/frequency.js中定义的频率字符串。例如“每日”，“每周”或“每月”。

在较低的情况下，特定于Gatherer的设置将以收集者的名字列为自己的财产。例如， WebPagetests的设置将是：

• webpagetest
  • settings ：设置对象包含审核位置，连接等。
  • metadata ：元数据对象包含WebPagetests的ID，JSON URL等。

结果对象

标准Result对象包含以下属性：

• selected ：是否为此Result进行检索。
• id ：为此Result自动生成的独特ID。
• type ： Single或Recurring审核。
• status ： Submitted ， Retrieved或Error 。有关详细信息，请参阅src/common/status.js 。
• label ：此Result的字符串标签。该标签从其原始Test对象继承。
• url ：审核的URL。
• createdTimestamp ：创建此Result时。
• modifiedTimestamp ：最后修改此Result时。

标准化指标

AWP中使用的所有公制名称都需要遵循名称敏感的名称。请参阅src/common/metrics.js中标准化指标的完整列表

• 定时指标

  • TimeToFirstByte
  • FirstPaint
  • FirstMeaningfulPaint
  • FirstContentfulPaint
  • VisualComplete
  • SpeedIndex
  • DOMContentLoaded
  • LoadEvent
  • TimeToInteractive
  • TotalBlockingTime
  • FirstCPUIdle
  • FirstInputDelay
  • LargestContentfulPaint

• 资源大小

  • HTML
  • Javascript
  • CSS
  • Fonts
  • Images
  • Videos

• 资源计数

  • DOMElements
  • Connections
  • Requests

• 资源分数

  • Performance
  • ProgressiveWebApp

源文件夹结构

主要功能的所有源代码都位于src文件夹中。文件被组织到以下子文件夹中：

• common ：常见的类和定义，例如状态，频率，指标等。
• connectors ：连接器类。
• extensions ：扩展类。
• gatherers ：收集者课。
• utils ：实用程序和工具。

单位测试

运行以下命令运行单元测试：

 npm test

要运行单个测试规格，您可以将Jest NPM模块安装到本地计算机：

 npm install -g jest
jest test/some-module.test.js

单位测试设计

单元测试基于开玩笑的单位测试框架。所有单元测试均位于./test文件夹中，并将其组织到其自己的相应子文件夹中，与src文件夹中的结构相同。