웹페이지 속도 측정 해보고 개선하자, 구글 웹페이지 속도 측정 최적화하기

Intro

페이지 리뉴얼을 담당으로 진행하였다. 

오픈 후에는 구글 웹페이지 속도 측정 도구를 이용하여 페이지 성능을 검증해보았다. 

검증 결과를 토대로 개선이 필요한 사항들을 파악과 해결 후 기록

 

 

---

 

https://pagespeed.web.dev/?hl=ko

 

 

Google Page Speed Insights

데스크톱 및 모바일에서 웹페이지 사이트 성능을 테스트하기 위한 도구

 

 

 

 

---

 

 

 

 

 

 

📌 문제점

이미지 로드가 오래걸린다는 문제가 확인되었다.

현재 문제가 되는 이미지는 png 파일형식으로 크기도 꽤 큰 편이였다. 

불필요한 파일 소스들이 많다는 점도 문제가 되었다.

 

 

 

 

✔  개선사항 체크하기

문제를 개선하기 위해 jpg, png 이미지들을 .webp 이미지로 교체하기로 하였다.

.webp란 이미지 품질은 그대로 유지하면서도 다른 파일형식과 비교하여 더 낮춰서 저장할 수 있다.

이에 적극적으로 구글에서는 추천하고 있는 확장자라고 한다.

거의 모든 브라우저 지원

 

 

1. 이미지 webp 로 바꾸기

2. 사용되지 않는 script 파일과 소스 정리하기 

 

 

 

---

 

 

✅ 적용 후 

 

 

 

이미지 교체와 불필요한 소스 제거를 통해 웹사이트 성능과 기능이 향상되었음을 확인 할 수 있었다.

웹사이트 전반적인 성능이 80까지 올라가게 되었고 로딩 속도 시간도 감소하였다. 

웹사이트 최적화와 사용자 경험 개선의 중요성을 깨닫게 되었다.