서론: 애드센스만 달면 느려지는 워드프레스, 해결책은?
티스토리에서 워드프레스로 블로그를 이사 오면서 가장 신경 쓰이는 부분은 단연 워드프레스 속도 최적화입니다. 저는 현재 클라우드웨이즈(Cloudways) 호스팅에 가볍기로 소문난 GeneratePress 테마를 사용 중이라 속도에 자신 있었습니다.
하지만 구글 PageSpeed Insights 점수를 확인해 보고 충격을 받았습니다. 모바일 점수가 고작 20~30점대에 머물렀기 때문입니다. 텍스트 위주의 가벼운 블로그인데도 말이죠.
원인을 분석해 보니 범인은 바로 수익을 위해 달아놓은 ‘구글 애드센스 광고’와 무거운 ‘플러그인’들이었습니다. 보통 이런 경우 WP Rocket 같은 유료 플러그인을 추천하지만, 저는 무료 설정만으로 워드프레스 속도 최적화에 성공하여 모바일 점수를 87점(상위 1% 수준)까지 끌어올렸습니다.
오늘은 그 비결인 Flying Scripts 설정법과 저만의 최적화 노하우를 상세히 공유해 드리겠습니다.
1. 내 사이트 속도 진단하기
먼저 구글 PageSpeed Insights에서 자신의 블로그 주소를 넣어보세요. 모바일 점수가 낮고 아래와 같은 경고가 뜬다면 이 글의 방법이 특효약입니다.워드프레스 속도 최적화를 시작하기 전, 현재 상태를 파악하는 것이 중요합니다. 구글에서 제공하는 PageSpeed Insights 사이트에 접속해 자신의 블로그 주소를 넣어보세요.
대부분의 수익형 블로그는 ‘데스크톱’ 점수는 좋지만, ‘모바일’ 탭에서 점수가 처참하게 나옵니다. 만약 분석 결과에 아래와 같은 빨간색 경고가 뜬다면, 이 글의 방법이 특효약이 될 것입니다.
- TBT (Total Blocking Time) 높음: 스크립트가 화면을 막고 있다는 뜻입니다.
- 사용하지 않는 자바스크립트 줄이기: 당장 필요 없는 코드가 너무 많다는 경고입니다.
- 제3자 코드(Third-party code) 영향: 애드센스 광고 코드가 범인입니다.
이 모든 문제는 애드센스 광고 스크립트가 로딩 초기에 너무 많은 리소스를 잡아먹기 때문에 발생합니다. 따라서 워드프레스 속도 최적화의 핵심은 이 광고 스크립트를 어떻게 다루느냐에 달려 있습니다.
2. 핵심 해결책: Flying Scripts (광고 지연 로딩)
제가 워드프레스 속도 최적화를 위해 선택한 방법은 바로 “광고를 조금 늦게 불러오는 것”입니다. 방문자가 글을 읽기 시작한 뒤, 아주 잠깐 뒤에 광고를 띄워도 수익에는 지장이 없습니다. 이를 도와주는 무료 플러그인이 바로 Flying Scripts입니다.
🚀 단계별 설정 방법
- 워드프레스 관리자 메뉴에서 플러그인 > 새로 추가로 이동합니다.
- 검색창에 [Flying Scripts]를 검색하여 설치 및 활성화합니다.
- Settings > Flying Scripts 메뉴로 들어갑니다.
- Include Keywords 칸에 지연시키고 싶은 스크립트 키워드를 입력합니다. 애드센스의 경우 아래 두 줄을 복사해서 넣으세요.Plaintext
adsbygoogle.js show_ads_impl - Timeout을
5s로 설정합니다. (방문자 접속 5초 뒤에 코드를 실행한다는 뜻입니다.)
이 설정 하나만으로 제 블로그의 워드프레스 속도 최적화 점수는 27점에서 87점으로 수직 상승했습니다. 구글 봇이 사이트를 방문했을 때 “이 사이트는 무거운 스크립트 없이 아주 쾌적하구나!”라고 인식하게 만드는 원리입니다.
3. 숨겨진 속도 도둑: ‘WP 통계’ & ‘불펌 방지’
완벽한 워드프레스 속도 최적화를 위해서는 눈에 보이지 않는 범인들도 검거해야 합니다. 플러그인 목록을 점검하다가 점수를 깎아먹는 두 가지 요소를 발견했습니다.
- WP 통계 (WP Statistics): 방문자가 올 때마다 내부 데이터베이스(DB)에 접속하여 기록을 남깁니다. 데이터가 쌓일수록 서버 반응 속도가 느려집니다. 과감히 삭제하고 구글 애널리틱스(GA4)나 서치 콘솔을 활용하는 것이 좋습니다.
- 무거운 불펌 방지 플러그인: 콘텐츠 보호는 중요하지만, 무거운 자바스크립트를 계속 돌리는 방식은 좋지 않습니다. 플러그인을 삭제하고, 대신 가벼운 CSS 코드로 대체하는 것이 워드프레스 속도 최적화에 훨씬 유리합니다.
✅ 불펌 방지 CSS 코드 (플러그인 대체용)
외모 > 사용자 정의하기 > 추가 CSS에 아래 코드를 넣으세요.
CSS
/* 가벼운 드래그 및 우클릭 방지 */
body {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
4. 사용자 경험(CLS) 챙기기 – 워드프레스 속도 최적화
광고를 늦게 뜨게 설정하면, 사용자가 글을 읽다가 갑자기 광고가 툭 하고 튀어나오면서 읽던 글자가 아래로 밀리는 현상(CLS, 누적 레이아웃 이동)이 생길 수 있습니다. 이는 구글 SEO 점수 감점 요인이므로, 진정한 워드프레스 속도 최적화라고 할 수 없습니다.
이를 막기 위해 광고가 들어갈 자리의 높이를 미리 잡아주는 CSS를 추가하면 완벽합니다.
CSS
/* 애드센스 자동 광고 영역 높이 미리 확보 (예시) */
.google-auto-placed {
min-height: 280px;
display: block;
clear: both;
}
이 코드를 추가하면 광고가 뜨기 전에도 빈 공간이 확보되어 있어, 화면 덜컥거림 없이 쾌적한 환경을 제공할 수 있습니다.
결론: 속도 최적화, 어렵지 않습니다
저는 Cloudways 호스팅의 기본 캐시 플러그인인 Breeze와 위에서 설명한 무료 설정들만으로 워드프레스 속도 최적화를 마쳤습니다.
복잡한 코딩이나 비싼 유료 플러그인 없이도, 1) Flying Scripts로 애드센스 무게 줄이기, 2) 무거운 플러그인 정리하기, 3) 기본 캐시 활용하기 이 세 가지만 지키면 됩니다.
여러분도 지금 바로 적용해 보세요. 모바일 점수 80점대 후반은 충분히 가능합니다. 속도 스트레스에서 벗어나 쾌적한 환경에서 양질의 포스팅을 발행하는 데 집중하시길 바랍니다!
<함께 읽으면 좋은 글>