💡문제 메인페이지가 랜더링이 늦으면 유저 입장에서 좋지않기에 Lighthouse를 이용해 성능최적화를 시도해보기로 했다. 💪🏻해결 첫째, png 파일은 모두 webp로 변환해서 다시 적용했다. WebP 및 AVIF와 같은 이미지 형식은 PNG나 JPEG보다 압축률이 높기 때문에 다운로드가 빠르고 데이터 소비량도 적습니다. 둘째, link에 rel="preload" 를 사용한다. 참고링크 최대 콘텐츠풀 페인트 최적화 Largest Contentful Paint(최대 콘텐츠풀 페인트, LCP)는 페이지의 메인 콘텐츠가 화면에 모두 렌더링되었을 때를 결정하는 데 사용됩니다. 느린 서버 응답 시간, 리소스 로드 시간, 클라이언트 측 렌더 web.dev LCP 요소에서 사용된 이미지를 미리 로드하여 LCP 시간을..
