TIL_21.01.18 🏃🏽‍♂️🏃🏽‍♂️

텍스트 압축

웹 페이지를 로드할 때 그에 필요한 리소스들도 받는다. (HTML, CSS, JS 등..)

이러한 문서들의 용량을 줄이기 위해서 텍스트 압축을 실행한다.

서버에서 보내는 리소스를 압축해서 사용.

압축 알고리즘

• GZIP

• Deflate (LZ77)

클라이언트가 아닌 서버에서 압축된 파일을 제공해야하기 때문에 서버 쪽에서 작업해준다.

압축을 하고 푸는 과정에서 시간이 소비가 된다. 따라서 2kB 이상의 크기를 가진 파일만 압축을 하는걸 추천한다.

최적화 순서

1. Performance 검사
2. 이미지 사이즈 최적화
3. Bottleneck 코드 최적화
4. Code Splitting
5. Text compression

최적화 추가

• 렌더링 성능 최적화

  • 애니메이션 최적화 (Reflow, Repaint)

• 로딩 성능 최적화

  • 컴포넌트 Lazy Loading (Code Splitting)
  • 컴포넌트 Preloading
  • 이미지 Preloading