SVG1 프론트엔드 성능 개선기 - 이미지 최적화 관련 피드백을 받지 못했던 걸 보면 나만 느낀 것일 수도 있는데, 우리 프로젝트를 이용하면서 처음 화면 렌더링 시간이 좀 느린 것 같다는 생각이 들었다. 그래서 간단하게 라이트하우스(Lighthouse; 웹페이지의 품질을 측정하기 위한 오픈소스 자동화 도구)를 돌려보게 되었다. 크롬 개발자 도구에 들어가 이렇게 설정을 하고(모바일 환경에서 이용되는 경우가 많아 기기는 모바일로 선택), 분석 버튼을 누르니 이런 결과 화면이 나왔다. 역시 좀 느린 게 맞았어..! 여기서 눈에 띄는 항목으로 최대 콘텐츠 렌더링 시간(Largest Contentful Paint)이라는 것이 있는데, LCP라고 불리는 이 지표는 최대 텍스트 또는 이미지가 표시되는 시간을 의미한다고 한다. 즉, 페이지 주요 내용의 렌더링 완료 시.. 2023. 9. 26. 이전 1 다음