진단 배경
콘텐츠와 플러그인이 점점 늘어나는 전형적인 워드프레스 사이트를 가정해, 실제 진단 절차가 어떻게 진행되는지 테스트 환경에서 재현했습니다.
진단 대상은 테스트용으로 구성한 사이트이며, 아래 수치는 모두 테스트 환경에서 측정한 예시 데이터입니다.
측정 환경과 대상
측정은 워드프레스 6.x, 일반적인 공유 호스팅 사양의 테스트 환경에서 수행했습니다.
대상 페이지는 메인 페이지이며, 측정 도구는 PageSpeed Insights와 크롬 성능 패널을 함께 사용했습니다.
주요 발견
측정 결과 LCP 4.2초, INP 380밀리초, CLS 0.24로 나타났습니다. 가장 큰 원인은 원본 크기 그대로 전달되는 대형 이미지와 동작하지 않는 페이지 캐시였습니다.
이미지와 캐시 문제를 먼저 잡고, 플러그인 정리와 데이터베이스 정리를 이어가는 순서로 제안했습니다.
| LCP(나쁨) | 4.2s | 화면에서 가장 큰 콘텐츠가 나타나기까지 걸린 시간 |
|---|---|---|
| INP(개선 필요) | 380ms | 사용자 동작에 페이지가 반응하는 속도 |
| CLS(나쁨) | 0.24 | 페이지가 뜨면서 화면이 흔들리는 정도 |
| TTFB(개선 필요) | 1.1s | 서버가 응답을 시작하기까지 걸린 시간 |
테스트 환경에서 측정한 예시 데이터입니다.
개선 우선순위
우선순위 1: 이미지 최적화와 캐시 재구성. 노력 대비 효과가 가장 큰 항목입니다.
우선순위 2: 사용하지 않는 코드 정리. 우선순위 3: 데이터베이스 정리와 반복 관리 주기 수립.
| 우선순위 | 문제 | 개선 방향 |
|---|---|---|
| P1 | 대형 이미지가 원본 크기로 전달됨 | 적정 크기 변환과 지연 로딩 적용 |
| P1 | 페이지 캐시 미동작 | 캐시 규칙 재구성 후 동작 확인 |
| P2 | 미사용 코드가 대부분 페이지에 포함됨 | 플러그인 정리 후 필요 페이지만 로드 |
| P3 | 데이터베이스에 오래된 데이터 누적 | 백업 후 정리, 반복 정리 주기 수립 |
테스트 환경 진단 결과를 정리한 예시입니다.