CS 공부, 기타

Lighthouse

Disciple428 2024. 12. 13. 09:20
  • Lighthouse

Google Chrome에서 제공하는, 웹 페이지의 성능을 측정하고 품질을 개선할 수 있는 오픈 소스 형태의 자동화 도구이다. 모바일, 데스크탑에서 모두 측정할 수 있으며, 성능, 접근성, SEO 등 사이트에 대한 전반적인 진단을 할 수 있다.

 

  • Lighthouse 검사 항목

1. Performance (웹 성능)

화면에 콘텐츠가 표시되는데 시간이 얼마나 걸리는지, 표시된 후 사용자와 상호작용이 가능하기까진 얼마나 걸리는지, 화면에 불안정한 요소는 없는지 등

 

2. Accessibility (웹 접근성)

대체텍스트를 잘 작성했는지, 배경색과 콘텐츠 색상의 대비가 충분한지, 적절한 WAI-ARIA 속성을 사용했는지 등

 

3. Best Practices (웹 표준 모범 사례)

웹 페이지가 웹에 대한 표준 모범 사례를 따르고 있는지

→ 웹 애플리케이션을 가동할 때 콘솔에 오류가 출력되진 않는지, 사용하지 않는 API를 호출하고 있지 않은지, HTTPS를 통해 해당 페이지에 접근할 수 있는지 등

 

4. SEO (검색 엔진 최적화)

웹 페이지가 검색 엔진에 대해 최적화된 순위 결과를 가지고 있는지

→ 웹 페이지의 robots.txt 파일 유효한지, <meta> 요소는 잘 작성되어 있는지, 텍스트 크기가 읽기에 무리가 없는지 등

 

5. PWA (Progressive Web App, 모바일 애플리케이션 작동 확인)

앱 아이콘을 제공하는지, 스플래시 화면이 있는지, 화면 크기에 맞게 콘텐츠를 적절하게 배치했는지 등을 고려하여 점수가 아닌 체크리스트로 확인