로딩 최적화 - ChoDragon9/posts GitHub Wiki

Time to First Byte(TTFB)

느린 서버 응답 시간은 성능에 영향을 미친다.

서버 응답 시간을 개선하는 방법은 여러 방법이 있다.

  1. 서버의 응용 프로그램 최적화
  2. 데이터베이스를 쿼리하는 방법 최적화
  3. 더 많은 메모리 또는 CPU를 가지도록 서버 하드웨어 업그레이드

First Contentful Paint(FCP)

  • 로드
    • 요청 수를 줄이고 전송 크기를 작게 유지
    • 필요한 오리진에 사전 연결
    • 서버 응답 시간(TTFB) 감소
    • 여러 페이지 리다이렉션 방지
    • 요청 프리로드
    • 큰 페이로드 방지
    • 효율적인 캐시 정책으로 정적 에셋 제공
    • CSS 용량 최적화
    • 사용하지 않는 CSS 제거
    • 중요한 요청 깊이 최소화
    • 웹 폰트 로드 중에 텍스트가 계속 보이는지 확인
    • 렌더링 차단 리소스 제거
  • 과도한 DOM 크기 피하기
    • 네트워크 효율성이 떨어짐
    • 런타임에 렌더링 속도 저하
    • 사용자 기기의 메모리 성능 영향

Largest Contentful Paint(LCP)

  • 느린 서버 응답 시간을 최적화
  • JavaScript와 CSS 같은 렌더링 차단 요청 최적화
    • CSS 최적화
    • JavaScript 최적화
  • 리소스 로딩 시간 최적화
    • 웹 폰트 최적화
    • 이미지 최적화
    • PRPL 패턴
      • Push(Preload), Render, Pre-cache, Lazy load
  • 클라이언트 사이드 렌더링 최적화
    • CRP 최적화