프로젝트
웹 성능 최적화 - 1. 이미지
최근 개인적으로 진행하고 있는 사이드 프로젝트의 화면이다. gif 파일을 검색하고 공유할 수 있는 플랫폼인 giphy.com을 클론하고 있다. 스크린샷에서 알 수 있다시피 대부분의 data가 img, video 파일들이다. 현재 진행상황은 랜더링과 검색기능만 간단하게 구현된 상태이며, 추가 기능 구현에 앞서 더 나은 ui를 위해 성능최적화 작업을 진행 중에 있다. 라이트 하우스로 웹 성능을 측정해본 결과 형편없는 점수가 나왔다. 이미지 파일의 크기를 줄이기 위해 기존에 사용하던 img 태그 대신 next/image 를 사용하여 리팩토링을 진행했고, gif 파일형식 대신 webp 파일형식을 사용했으나 큰 차이는 없었다. 원인 분석 이미지 성능을 개선하기에 앞서 웹 성능에 주요한 영향을 미치는 요인들에 대해..
