Lighthouse v3 이전 가이드

이 가이드는 다음과 같은 Lighthouse v2 사용자를 대상으로 합니다.

  • Node 또는 명령줄에서 Lighthouse를 실행합니다.
  • Lighthouse의 JSON 출력을 사용합니다.

이러한 사항이 적용되지 않는 경우 Lighthouse를 실행하는 워크플로는 거의 동일합니다. 새로운 개요는 Lighthouse 3.0 발표를 참고하세요. 확인할 수 있습니다

호출 변경사항

이제 Lighthouse는 기본적으로 시뮬레이션된 실적을 계산하며 제한 설정이 크게 변경되었습니다.

CLI 플래그

시나리오 v2 플래그 v3 플래그
DevTools 3G 제한 없음 (기본 동작) --throttling-method=devtools
제한 없음 --disable-network-throttling --disable-cpu-throttling --throttling-method=provided
네트워크 제한, CPU 제한 없음 --disable-cpu-throttling --throttling-method=devtools --throttling.cpuSlowdownMultiplier=1
성능 감사 실행 --perf --preset=perf
혼합 콘텐츠 감사 실행 --mixed-content --preset=mixed-content

노드 모듈

Lighthouse v3에서 Node 모듈은 CLI와 동일한 구성 옵션을 허용합니다. 이것은 v2에서는 이러한 옵션 중 다수가 무시되었지만 이제는 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);
}

출력 변경사항

JSON 출력의 새로운 최상위 형식

Lighthouse v3가 반환하는 JSON 객체에는 이제 3개의 최상위 속성이 포함됩니다.

  • lhr 감사 결과입니다. 'Lighthouse 결과'의 줄임말입니다. 이는 본질적으로 v2의 최상위 객체였지만 v3에서는 이 객체의 도형에도 중대한 변경사항이 도입되었습니다. 자세한 내용은 결과 객체 변경사항
  • artifacts 감사 중에 Chrome에서 수집된 데이터입니다. 이전에는 이러한 방식이 LHR의 속성으로 구성됩니다.
  • report 문자열로 형식이 지정된 보고서 HTML/JSON/CSV입니다.

결과 객체 변경사항

JSON 출력의 새로운 최상위 형식에서 언급했듯이 이제 감사 결과는 다음과 같습니다. lhr 속성을 통해 사용할 수 있습니다. v2에서는 이 객체의 콘텐츠가 기본적으로 최상위 JSON 출력입니다. 그러나 v3에서는 이 객체의 모양이 변경되었습니다. 아래 표 모든 변경사항이 나열됩니다.

  • 행의 v2 및 v3 열 모두에 값이 있는 경우 코드에서 v2 속성에 대한 참조를 v3에 해당하는 값으로 바꿔야 합니다.
  • 행에 v3 열의 값이 없는 경우 Notes 열은 옵션이 있습니다.
  • ID와 같은 항목은 자리표시자 텍스트를 나타냅니다.
v2 속성 v3와 동등 참고
initialUrl requestedUrl
url finalUrl
generatedTime fetchedTime
reportCategories categories 배열에서 키가 지정된 객체로 변경되었습니다.
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 가능한 값이 다음으로 확장되었습니다. numeric|binary|manual|informative|not-applicable|error
audits.ID.score audits.ID.score scoreDisplayMode가 숫자 또는 바이너리인 경우 점수는 항상 0과 1 사이의 숫자(0~100이 아님)입니다. 점수는 다른 디스플레이 모드의 경우 항상 null입니다. 통과/실패의 개념입니다.
audits.ID.displayValue audits.ID.displayValue 이제 문자열 보간 유형을 위한 printf 스타일 인수의 배열이 될 수 있습니다.
audits.ID.debugString audits.ID.explanation audits.ID.errorMessage audits.ID.warnings debugString 값이 위의 세 가지 속성 중 하나로 변환되었습니다. 선택할 수 있습니다
audits.ID.details audits.ID.details 세부정보 구조가 더 사용하기 쉽도록 변경되었습니다. .items의 각 항목 는 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 삭제되었습니다. 대신 details를 사용하세요.