Guía de migración de Lighthouse v3

Esta guía está destinada a los usuarios de Lighthouse v2 que:

  • Ejecuta Lighthouse desde Node o la línea de comandos.
  • Confía en el resultado JSON de Lighthouse.

Si estos no se aplican a tu caso, entonces tu flujo de trabajo para ejecutar Lighthouse es casi el mismo. Consulta Anuncio de Lighthouse 3.0 para obtener una descripción general de las características y cambios.

Cambios de invocación

Lighthouse ahora calcula el rendimiento simulado de forma predeterminada y la configuración de limitación cambió.

Marcas de CLI

Situación Marcas de v2 Marcas de la v3
Limitación de 3G de Herramientas para desarrolladores Ninguna (comportamiento predeterminado) --throttling-method=devtools
Sin regulación --disable-network-throttling --disable-cpu-throttling --throttling-method=provided
Limitación de la red, sin limitación de CPU --disable-cpu-throttling --throttling-method=devtools --throttling.cpuSlowdownMultiplier=1
Ejecuta auditorías de rendimiento --perf --preset=perf
Ejecuta auditorías de contenido mixto --mixed-content --preset=mixed-content

Módulo de nodo

En Lighthouse v3, el módulo Node acepta las mismas opciones de configuración que la CLI. Este es un cambio rotundo en el sentido de que muchas de estas opciones se ignoraron en la v2, mientras que ahora afectan la ejecución de Lighthouse.

const fs = require('fs');
const lighthouse = require('lighthouse');

async function run() {
  // `onlyCategories` was previously only available as a config setting.
  // `output` was previously only available in CLI.
  const flags = {onlyCategories: ['performance'], output: 'html'};
  const html = (await lighthouse('https://google.com/', flags)).report;
  fs.writeFileSync('report.html', html);
}

Cambios en los resultados

Nuevo formato de nivel superior en el resultado de JSON

El objeto JSON que muestra Lighthouse v3 ahora contiene 3 propiedades de nivel superior:

  • lhr Los resultados de las auditorías. Es la sigla en inglés de "Resultados de Lighthouse". Este era, en esencia, el objeto de nivel superior en la v2, pero la v3 también introduce cambios drásticos en la forma de este objeto. Consulta Cambios en el objeto de resultados.
  • artifacts: Los datos recopilados de Chrome durante la auditoría. Anteriormente, se mezclaba con las propiedades de la LHR.
  • report El informe con formato HTML/JSON/CSV como una cadena

Cambios en el objeto de resultados

Como se menciona en Nuevo formato de nivel superior en el resultado JSON, los resultados de las auditorías ahora están disponibles a través de la propiedad lhr. En la v2, el contenido de este objeto era esencialmente salida JSON de nivel superior. Sin embargo, la forma de este objeto cambió en la v3. La siguiente tabla enumera todos los cambios.

  • Si una fila tiene un valor en las columnas v2 y v3, significa que debes reemplazar cualquier referencia a la propiedad v2 en tu código por el equivalente de v3.
  • Cuando una fila no tiene un valor en la columna v3, la columna Notes describe tus opciones.
  • Ten en cuenta que los elementos como ID representan el texto del marcador de posición.
Propiedad v2 Equivalente a v3 Notas
initialUrl requestedUrl
url finalUrl
generatedTime fetchedTime
reportCategories categories Se cambió de array a un objeto con clave.
reportGroups categoryGroups
audits.ID.name audits.ID.id
audits.ID.description audits.ID.title
audits.ID.helpText audits.ID.description
audits.ID.scoringMode audits.ID.scoreDisplayMode Los valores posibles se expandieron a numeric|binary|manual|informative|not-applicable|error
audits.ID.score audits.ID.score Las puntuaciones siempre son un número entre 0 y 1 (no entre 0 y 100) cuando scoreDisplayMode es numéricos o binarios. Las puntuaciones siempre son null para otros modos de visualización, ya que no hay noción de aprobado o reprobado.
audits.ID.displayValue audits.ID.displayValue Ahora puede ser una matriz de argumentos de estilo printf para la interpolación de cadenas.
audits.ID.debugString audits.ID.explanation audits.ID.errorMessage audits.ID.warnings Los valores de debugString se convirtieron en una de las tres propiedades anteriores según su intención.
audits.ID.details audits.ID.details La estructura de los detalles cambió para ser más consumible. Cada entrada de .items es un objeto con claves confiables en lugar de any[].
audits.ID.error audits.ID.scoreDisplayMode === 'error'
audits.ID.notApplicable audits.ID.scoreDisplayMode === 'not-applicable'
audits.ID.informative audits.ID.scoreDisplayMode === 'informative'
audits.ID.manual audits.ID.scoreDisplayMode === 'manual'
audits.ID.extendedInfo Se quitó el elemento. Usa details en su lugar.