퍼포먼스튜닝 (1) 썸네일형 리스트형 [refactor] Lv.4.1 이미지 성능 최적화로 LCP 개선하기 지난 글에서는 Lighthouse 리포트를 기반으로 이미지 최적화가 왜 중요한지, 그리고 이를 위한 다양한 대응 방안들을 소개했다.이번 글에서는 제가 직접 React + HTML 프로젝트에 최적화 기법을 적용한 과정을 구체적으로 공유해보려 한다.모든 실험은 Chrome 시크릿 모드에서 진행했으며 최종 성능 개선 결과는 글 마지막에 첨부할 예정이다.우선 적용한 최적화 방법 정리이번 성능 개선 작업에서는 LCP(Largest Contentful Paint)를 최적화하기 위해 총 4가지 기법을 실제로 적용했다. 각 기법은 이미지 렌더링과 관련된 브라우저 동작에 직접적으로 영향을 주는 요소들로, 아래와 같은 이유로 선택되었다.1. WebP 포맷 적용 – 더 가볍고 빠르게우선 기존의 PNG 이미지 대신 WebP .. 이전 1 다음
