<aside> 🔗

목차

성능최적화 도구

성능측정대상

문제분석

1. SPA기반의 느린 초기 로딩 속도

2. 빈번한 이미지 사용

3. 웹 폰트의 크기

</aside>

<aside> ✅

성능 최적화에 사용된 도구 및 라이브러리는 초록색으로 표시했습니다!

</aside>

성능최적화 도구

1. Light House
2. 네트워크 탭
3. vite-bundle-visualizer

성능 측정 대상

시간 관계상 모든 페이지에 대한 최적화를 진행하기 어렵기 때문에 사용자가 가장 많이 들어가게 될 페이지인 ai 피팅 페이지와 홈페이지 위주로 로드시간을 측정 대상으로 삼았다.

문제 분석

우리 서비스의 성능 문제는 다음과 같다

<aside> 🚨

1. SPA기반의 느린 초기 로딩 속도

2. 빈번한 이미지 사용

3. 웹 폰트의 크기

</aside>

1. SPA기반의 느린 초기 로딩 속도

홈페이지를 로드하는데 모든 페이지가 로드됨….