Elementor 속도 저하 해결로 Google PageSpeed 점수를 크게 올립니다

Elementor 사용 시 속도 저하 해결은 Elementor를 이용한 병원 사이트를 관리하는 분들 대부분이 겪는 문제입니다. Elementor는 강력한 드래그앤드롭 빌더이지만 기본 설정에서는 불필요한 CSS·JS가 모든 페이지에 로드됩니다. PageSpeed Insights로 측정하면 “렌더링 차단 리소스”와 “사용하지 않는 CSS 제거” 항목에서 Elementor 관련 파일이 목록 상위를 차지합니다.

Elementor 실험 기능 활성화

Elementor 3.x부터 성능 관련 실험 기능이 추가됐습니다.

Elementor → 설정 → 실험 기능(Experiments)

성능 관련 항목 활성화 권장:

• Improved CSS Loading: 필요한 CSS만 해당 페이지에 로드
• Inline Font Icons: 아이콘 폰트를 인라인 SVG로 대체
• Optimized DOM Output: 불필요한 div 중첩 감소

이 세 가지만 켜도 LCP, TBT 개선이 체감됩니다.

Elementor 에셋 최소화

Elementor → 도구 → 일반 → CSS 인쇄 방법: "내부 임베딩" 또는 "외부 파일"

외부 파일로 설정하면 CSS가 캐시될 수 있어서 반복 방문자에게 빠릅니다.

Elementor → 도구 → 재생성 → CSS 재생성

설정 변경 후 항상 CSS를 재생성해야 변경 내용이 적용됩니다.

미사용 Elementor 위젯 비활성화

기본적으로 모든 Elementor 위젯이 로드됩니다. 사이트에서 실제로 쓰는 위젯만 활성화하면 불필요한 JS 로드를 줄일 수 있습니다.

Elementor → 요소 → 사용하지 않는 위젯 비활성화

병원 사이트에서 주로 쓰는 위젯: 텍스트, 이미지, 버튼, 폼, 아코디언 정도입니다. 슬라이더, 카운터, 리뷰 등 쓰지 않는 것은 비활성화하세요.

캐시 플러그인과 함께 사용

Elementor는 LiteSpeed Cache나 W3TC와 함께 사용할 때 효과가 극대화됩니다. 캐시 플러그인의 “CSS 최소화”와 “JS 지연 로드” 기능을 함께 활성화하세요.

단, 일부 Elementor 기능(팝업, 폼)은 JS 지연 로드와 충돌할 수 있습니다. 적용 후 사이트 모든 기능이 정상 작동하는지 꼼꼼히 확인하세요.