psi 다운로드 - psi 소스 코드 다운로드

psi

기타 소스코드

4.1.0

다운로드

psi

보고 기능이 포함된 PageSpeed Insights

빌드 프로세스에 대한 깔끔한 보고 기능과 함께 Google PageSpeed Insights v5를 사용하여 배포된 사이트에 대한 모바일 및 데스크톱 성능 테스트를 실행하세요.

설치하다

 $ npm install psi

용법

 const psi = require ( 'psi' ) ;

( async ( ) => {
  // Get the PageSpeed Insights report
  const { data } = await psi ( 'https://theverge.com' ) ;
  console . log ( 'Speed score:' , data . lighthouseResult . categories . performance . score ) ;

  // Output a formatted report to the terminal
  await psi . output ( 'https://theverge.com' ) ;
  console . log ( 'Done' ) ;

  // Supply options to PSI and get back speed
  const data2 = await psi ( 'https://theverge.com' , {
    nokey : 'true' ,
    strategy : 'desktop'
  } ) ;
  console . log ( 'Speed score:' , data2 . data . lighthouseResult . categories . performance . score ) ;
} ) ( ) ;

PSI 2.x부터 PageSpeed Insights 속도와 유용성 점수를 모두 공개합니다. 후자는 합리적인 모바일 뷰포트의 존재 여부와 같은 요소를 기반으로 페이지 점수를 매기는 유용성 규칙을 기반으로 합니다.

API

psi(url, [옵션])

Google PageSpeed Insights의 응답 데이터에 대한 약속을 반환합니다.

URL

유형: string

PageSpeed Insights API가 결과를 생성해야 하는 페이지의 URL입니다.

옵션

유형: Object

열쇠

유형: string
기본값: 무료 등급

프로덕션 수준 빌드 프로세스에 이 모듈을 사용하는 경우 Google 개발자 콘솔에서 API 키를 등록하는 것이 좋습니다.

전략

유형: string
기본값: mobile
값: mobile desktop

페이지를 분석할 때 사용하는 전략입니다.

장소

유형: string
기본값: en_US

로캘 결과는 다음에서 생성되어야 합니다.

한계점

유형: number
기본값: 70

PageSpeed 테스트를 통과하기 위한 기준점입니다. 성능 예산을 설정하는 데 유용합니다.

모래밭

유형: boolean
기본값: false

통과하면 기회에 대한 추가 정보가 포함된 링크가 추가됩니다. 기회에 대한 문서를 확인하는 데 유용합니다.

psi.output(url, [옵션])

형식화된 보고서를 터미널에 출력합니다.

Google PageSpeed Insights의 응답 데이터에 대한 약속을 반환합니다.

url 및 options psi() 와 동일합니다.

CLI

 $ npm install --global psi

 $ psi --help

  Usage
    $ psi <url>

  Options
    --key        Google API Key. By default the free tier is used
    --strategy   Strategy to use when analyzing the page: mobile|desktop
    --format     Output format: cli|json|tap
    --locale     Locale results should be generated in
    --threshold  Threshold score to pass the PageSpeed test

  Example
    $ psi https://addyosmani.com --strategy=mobile

일반적인 사용 사례

빌드 프로세스에 PSI를 추가합니다.

PSI를 사용한 샘플 Gulp 프로젝트를 사용할 수 있습니다.

Grunt를 사용하는 경우 grunt-pagespeed 는 내부적으로 PSI를 사용하는 James Cryer의 작업입니다.

로컬 프로젝트를 테스트하려면 psi-ngrok 또는 ngrok 사용하는 것이 좋습니다.

영사 슬라이드 가져오기

필름 스트립은 v5 API에서 데이터 URI로 반환되지만 psi 도구는 이를 cli에 노출하지 않습니다. 영사 슬라이드 (또는 감사 세부 정보)를 얻으려면 psi 요구하고 audits 개체에서 가져올 수 있습니다.

 const psi = require ( 'psi' ) ;

( async ( ) => {
  // Get the PageSpeed Insights report
  const { data } = await psi ( 'https://theverge.com' ) ;
  console . log ( data . lighthouseResult . audits [ 'screenshot-thumbnails' ] . details . items ) ;
} ) ( ) ;