목차 💡 속도 지수(Speed Index)는 무엇을 측정합니까?💡 속도 지수(Speed Index)는 성능 점수에 어떤 영향을 미칩니까?💡 속도 지수(Speed Index)는 어떻게 향상 시킵니까?   속도 지수는 웹 페이지의 로딩 속도를 평가하는 중요한 지표 중 하나입니다. 이것은 웹 페이지가 얼마나 빨리 화면 상단에 내용을 표시하는지를 측정하는 지표로, 사용자 경험을 향상시키고 성능을 최적화하는 데 도움이 됩니다.  속도 지수는 페이지의 로딩 속도를 측정하며, 이를 통해 페이지가 얼마나 빨리 시각적으로 완료되는지를 알 수 있습니다. 이것은 페이지의 로딩 동작을 시간의 흐름에 따라 프레임 단위로 분석하여 방문자의 경험을 반영하는 결과입니다.    속도 지수는 브라우저 뷰포트의 크기에 따라 다양하며..

목차 💡 메인 스레드 개념?💡 긴 메인 스레드 작업이 페이지 성능에 어떤 영향을 줍니까?💡 긴 메인 스레드 작업을 피하는 방법은 무엇입니까?   HTML/CSS 구문 분석, JavaScript 구문 분석/실행과 같은 이벤트는 기본 스레드 에서 실행되는 "작업" 입니다. 이러한 작업 중 하나가 50ms 이상 실행되면 "긴 작업"이라고 하며, First Paint 및 페이지가 완전히 상호 작용하는 데 걸리는 시간이 모두 지연될 수 있습니다. 방문자에게 좋은 페이지 경험을 제공하려면, 긴 메인 스레드 작업은 최대한 피해야 합니다. 　💡 메인 스레드 개념? 웹 브라우저에서 모든 일을 처리하는 '주요 작업 영역'과 같다고 생각할 수 있습니다.   이것은 웹 페이지를 로드하고 표시하는 주체로, 다음과 같은 ..

목차 💡 FCP(First Contentful Paint)는 무엇인가요?💡 FCP(First Contentful Paint)는 무엇을 측정하나요?💡 FCP(First Contentful Paint)이 성능 점수에 미치는 영향 어떻게 되나요?💡 FCP(First Contentful Paint)를 개선하는 방법은 무엇입니까?    First Contentful Paint (FCP)은 웹 페이지의 성능을 측정하는 중요한 지표 중 하나입니다. 이것은 웹 페이지가 사용자에게 시각적인 콘텐츠를 얼마나 빨리 보여주기 시작하는지를 나타내는 지표로, 사용자 경험과 웹 페이지의 로드 속도에 직접적인 영향을 미칩니다.  FCP는 다음을 나타내는데 사용됩니다.  ▶ 시각적 표현 시작 시점 FCP는 웹 페이지가 어떤 콘..

목차 💡 상호 작용까지의 시간(TTI)는 무엇입니까?💡 상호 작용까지의 시간(TTI)는 어떻게 측정하나요?💡 상호 작용까지의 시간(TTI)이 중요한 이유는 무엇입니까?           -    상호 작용까지의 시간(TTI)에 대한 임계값💡상호 작용까지의 시간(TTI)을 향상시키는 방법은 무엇입니까?     상호 작용까지의 시간(TTI)은 웹 페이지가 로드되고 사용자와 상호 작용 가능한 상태가 되는데 걸리는 시간을 나타내는 중요한 성능 지표입니다.    이것은 사용자가 페이지를 열었을 때 페이지가 얼마나 빨리 대화식으로 사용 가능한 상태가 되는지를 측정합니다. TTI는 웹 페이지 또는 애플리케이션의 전반적인 사용자 경험을 반영하며, 빠른 TTI는 사용자가 페이지를 빠르게 이용하고 상호 작용할 수 ..

목차 💡 총 차단 시간(TBT)은 무엇을 측정합니까?     -   총 차단 시간과 긴 메인 스레드 작업     -   총 차단 시간(TBT) vs 상호 작용까지의 시간(TTI)💡 총 차단 시간(TBT)은 성능 점수에 어떤 영향을 미칩니까?     -   총 차단 시간에 대한 임계값💡총 차단 시간(TBT)은 어떻게 향상 시킵니까?     총 차단 시간(TBT)이란,Total Blocking Time일시적으로 작동을 멈추는 시간  총 차단 시간(Total Blocking Time, TBT)은 웹 성능 측정에서 중요한 지표 중 하나로, 사용자 경험과 웹 페이지의 반응성을 평가하는 데 사용됩니다. 이 지표는 사용자가 웹 페이지와 상호 작용하는 동안 발생하는 지연을 측정하며, 아래는 TBT에 대한 개요입니..

목차 💡 가장 큰 콘텐츠 렌더링 시간(LCP)은 무엇을 측정합니까?💡 가장 큰 콘텐츠 렌더링 시간(LCP)은 성능에 어떤 영향을 줍니까?      -   가장 큰 콘텐츠 렌더링 시간에 대한 임계값💡 가장 큰 콘텐츠 렌더링 시간은(LCP) 어떻게 향상 시킵니까?    가장 큰 콘텐츠 렌더링 시간(Largest Contentful Paint, LCP)은 웹 페이지의 성능을 평가하는 중요한 지표 중 하나입니다. LCP는 사용자가 웹 페이지를 열었을 때 가장 큰 콘텐츠가 얼마나 빨리 렌더링되는지를 나타냅니다.  LCP는 웹 페이지가 얼마나 빨리 가장 중요한 콘텐츠를 화면에 표시하는지를 나타내는 지표입니다. 이 중요한 콘텐츠는 주로 이미지, 텍스트 블록 또는 비디오와 같은 시각적인 요소입니다. LCP가 빠를..

목차 💡  누적 레이아웃 이동(CLS)는 무엇을 측정합니까?💡 예상되는 레이아웃 변화 vs 예상되지 않는 레이아웃 변화💡 누적 레이아웃 이동(CLS)는 성능 점수에 어떤 영향을 미칩니까?💡 누적 레이아웃 이동(CLS)을 개선하는 방법은 무엇입니까?    누적 레이아웃 이동(Cumulative Layout Shift, CLS)는 웹 페이지의 사용자 경험을 개선하는 데 중요한 성능 지표 중 하나입니다. 이것은 웹 페이지가 로딩되는 동안 페이지의 요소들이 뜨거나 움직여서 사용자가 의도하지 않게 페이지를 조작하게 되는 정도를 측정합니다.  예시로 설명하면,뉴스 웹사이트를 방문할 때, 페이지가 로딩 중에 기사 제목과 이미지가 표시되는데, 갑자기 이미지가 로딩되면서 페이지 레이아웃이 변경될 수 있습니다. 이..