Lighthouse

나는 웹 성능 지표를 잘 알고 있었나?

요즘 Next.js 의 사용으로 렌더링 방식에 따른 FCP, LCP 등에 영향을 어떻게 미치는지와 웹 성능과 관련된 개념들을 더 깊게 알 필요가 생긴 것 같다. 때문에 웹 성능 최적화 지표에 대한 개념을 다시 정리해보고자 이렇게 글로 작성한다. FCP - First Contentful Paint FCP 매트릭은 First Contentful Paint의 약자로 페이지가 로드되기 시작한 시점부터 페이지 콘텐츠의 일부가 화면에 렌더링될 때까지의 시간을 측정한다. 이 메트릭에서 콘텐츠란 텍스트, 이미지(배경 이미지 포함), 요소 및 svg 요소를 뜻한다. 참고: https://w3c.github.io/paint-timing/#first-contentful-paint 위의 사진을 보면 두 번째 화면에서 최초 텍..