TIL_21.01.14 🏃🏽‍♂️🏃🏽‍♂️

성능 최적화 종류

• 로딩 성능
  • 이미지 사이즈 최적화
  • Code split
  • 텍스트 압축

• 렌더링 성능
  • Bottle neck code 최적화

크롬 Devtools - lighthouse 사용

Opportunities & Diagnostics

• Opportunities : 로딩(리소스) 최적화 가이드

• Diagnostics : 렌더링 최적화 가이드

---

이미지 사이즈 최적화

이미즈 사이즈 최적화를 할 때 우리 서버에 있는 리소스라면 직접 수정이 가능하지만 그게 아니라면 CDN을 활용

CDN (Content Delivery Network)

물리적 거리의 한계를 극복하기 위해 소비자와 가까운 곳에 컨텐츠 서버를 두는 기술.

Image CDN (Image processing CDN)

CDN + 이미지를 클라이언트에게 보내기 전에 특정 가공을 하여 전송 (확장자, 사이즈 변경)

---