[FE 성능 최적화 스터디] - 세 번째 미팅

2023년 7월 25일 화요일

3장 홈페이지 최적화

- 이미지 지연 로딩

- 이미지 사이즈 최적화

- 동영상 최적화

- 폰트 최적화

위 개념에 대해 살펴봤습니다.

 

이미지 지연 로딩 파트에서는 JS의 IntersectionObserver 객체를 사용해서 처리하는 방식,

 

이미지 사이즈 최적화 파트에서는 정적 파일에 대한 이미지 해상도 줄이기,

압축률 높은 webp 포맷으로 변환, 호환성 고려,

 

동영상 최적화에서는 호환성을 고려한 Video 태그와 webm 포맷,

 

폰트 최적화에서는 font-display, 압축률 높은 woff 포맷, 서브셋 폰트, base64 data URI 등에 대해 다뤘습니다.

 

이제 3장의 나머지 부분과 4장을 마지막으로 앞두면서

다음 주 책을 다 끝내고 잘 마무리 해보겠습니다~!