원티드 프리온보딩 프론트엔드 챌린지 사전미션 [최적화]

CDN(Content Distributed Network)에 대해 설명해주세요

데이터 사용량이 많은 애플리케이션의 웹 페이지 로드 속도를 높이는 상호 연결된 서버 네트워크이다. 
 
사용자는 웹 사이트를 방문할 때 해당 웹 사이트 서버의 데이터가 인터넷을 통해 사용자의 컴퓨터에 도달하게 된다. 이때 사용자가 해당 서버에서 멀리 떨어져 있는 경우 동영상이나 이미지와 같은 대용량 파일을 로드할 때 많은 시간이 걸리게 된다. 
 
반면 사용자와 가까운 거리에 있는 CDN 서버에 웹 사이트 콘텐츠를 저장해놓으면 사용자는 훨씬 빠른 속도로 콘텐츠를 로드할 수 있다.
 
즉, CDN은 콘텐츠 전송 시간을 줄여주는 네트워크이다.

CDN의 목적은 지연 시간을 줄이는 것이다. 지연 시간이란 웹 페이지 혹은 비디오 스트리밍 콘텐츠 등이 디바이스에 완전히 로딩되기 전에 발생하는 지연 시간을 말한다. 콘텐츠가 사용자에게 도달하기 위해 이동해야 하는 물리적 거리를 줄여 지연 시간을 줄이는 CDN도 있다.

따라서 CDN이 광범위하고 넓게 분산되어 있을수록 웹 콘텐츠를 보다 빠르고 안정적으로 전송할 수 있다.

 

이러한 CDN은 여러 지리적 위치에 접속 지점(POP) 또는 CDN 엣지 서버 그룹을 설정하는 방식으로 동작한다.

지리적으로 분산된 이 네트워크는 캐싱, 동적 가속 및 엣지 로직 계산의 원리를 기반으로 동작한다.

Web Vitals에 대해 설명해주세요

웹에서 훌륭한 사용자 경험을 제공하는 데 필수적인 품질 신호에 대한 통합 지침을 제공하기위한 Google의 측정 기준이다.
Web Vitals은 환경을 단순화하고 사이트가 가장 중요하게 생각하는 측정인 Core Web Vitals에 집중하도록 돕는 것을 목표로합니다.

Core Web Vitals

Web Vitals의 하위 집합으로 모든 사이트 소유자가 측정해야하며 모든 Google 도구에 표시된다.

 

• LCP (Largest Contentful Paint) : 로딩 성능을 측정합니다. 
  좋은 사용자 경험을 제공하려면 페이지가 처음로드되기 시작한 후 2.5 초 이내에 LCP가 발생해야합니다. 
• FID (First Input Delay) : 상호 작용을 측정합니다. 
  좋은 사용자 환경을 제공하려면 페이지의 FID가 100 밀리 초 미만이어야합니다. 
• CLS (Cumulative Layout Shift) : 시각적 안정성을 측정합니다. 
  좋은 사용자 환경을 제공하려면 페이지에서 0.1 미만의 CLS를 유지해야합니다.

Lighthouse에 대해 설명해주세요

Google Lighthouse는 웹페이지의 품질을 측정하기 위한 오픈 소스 자동화 도구입니다. 공개 또는 인증이 필요한 모든 웹 페이지에 대해 실행할 수 있습니다. Google Lighthouse는 웹 페이지의 성능, 접근성 및 검색 엔진 최적화 요소를 감사합니다. - 위키백과

Lighthouse는 구글에서 개발한, 웹 페이지의 품질을 개선할 수 있는 오픈 소스 형태의 자동화 도구이다. 어떤 웹 페이지든 (그것이 공개되었든, 인증이 필요하든) 사용할 수 있다.

• 대표적인 평가 지표
  • 성능 : 웹 페이지의 로딩 시간, 실행 시간 등 성능 관련 지표를 평가
  • 접근성 : 얼마나 사용자에게 포용적인 웹 환경을 제공하는지 평가
  • 최적화 (SEO) : Search Engine Online의 약자로 검색 결과에서 웹 페이지가 어떻게 표시되는지 분석하고 평가