워드프레스에서 HTTP/S 요청을 감소시켜 페이지 속도를 높여주는 WP Asset CleanUp 플러그인

브라우저가 서버로부터 무엇인가를 요청할 때마다 HTTP 혹은 HTTPS 요청이 발생합니다. 이것은 스타일시트, 이미지, 삽입된 동영상 또는 스크립트와 같은 파일이 될 수 있습니다. 기본적으로 사이트를 구성하는 모든 것이 될 수 있습니다. 이러한 각각의 것이 별도의 요청이 됩니다.

(HTTP 또는 HTTPS 요청은 서버에서 HTTPS 암호화가 설정되어 있는지 여부에 따라 결정되지만, 이것만 제외하면 HTTP 요청과 HTTPS 요청은 동일한 것이므로 여기에서는 편의상 HTTP 요청이라고 표기하겠습니다.)

요청된 모든 파일이 브라우저에 전달되어야만 웹사이트를 렌더링하므로 HTTP 요청은 중요합니다. 그렇지 않으면 방문자들이 사이트 내용을 볼 수가 없습니다.

따라서 브라우저에서 다운로드하여 처리해야 하는 것이 많으면 많을 수록 사이트 로드 속도가 느려질 수밖에 없습니다. 특히 사이트가 인기가 있어서 많은 방문자가 방문한다면 더욱 중요합니다. 이러한 경우 서버에서 많은 동시 HTTP 요청을 한 번에 처리해야 하므로 HTTP 요청수가 속도에 큰 영향을 미치게 됩니다.

사이트 최적화 플러그인으로 Autoptimize라는 플러그인이 현재 100만 개 이상 사이트에 설치되어 사용되고 있습니다. 자세한 내용은 "Autoptimize - 워드프레스 최적화 플러그인"를 참고해보세요. 그리고 이 블로그에 현재 사용되고 있는 Clearfy 플러그인도 참고해보세요.

HTTP/S 요청 확인하기

Google PageSpeed Insights, GTmetrix, Pingdom, WebPageTest 등 사이트 최적화/속도 측정 사이트를 이용하여 내 사이트의 HTTP 요청을 확인할 수 있습니다.

예를 들어, Pingdom Speed Test 사이트에서 테스트해보면 자세한 요청수를 포함한 자세한 Performance Insights(성능 인사이트)를 확인할 수 있습니다.

이 블로그에 사용된 Publisher라는 테마가 몇 달 전에 업데이트되면서 전반적으로 무거워졌습니다.

방금 속도 측정을 해보니 Combine external JavaScript에서 F 등급이 나왔네요. 해당 문제가 주로 구글 애드센스 광고 스크립트와 관련되어 있는 것 같습니다. 구글 애드센스 광고는 사이트 속도에 영향을 미칠 수 있고 과도한 광고를 표시하면 사용자 경험에 부정적인 영향을 미칠 수 있으므로 가능한 경우 애드센스 배너 광고를 운영하지 않는 것이 바람직한 것 같습니다.

실제로 이 블로그에서 광고를 제거하면 사이트 속도가 지금보다 훨씬 빠르게 로드됩니다.

구글 애드센스 광고 사이트 속도

하지만 이 블로그와 같이 정보를 전달하고 실제 제품을 판매하지 않는 사이트의 경우 다른 마땅한 방법이 없는 것이 현실입니다. 이 블로그에서는 사이트 방문자 수가 지속적으로 늘고 있지만 애드센스 광고 수익은 지속적으로 악화되고 있습니다.ㅠㅠ 혹시 애드 블록 광고 차단 기능을 활성화한 경우 이 블로그를 차단 목록에서 해제(화이트리스트에 추가)해주시면 감사하겠습니다.

장기적으로는 후원 등을 통해 웹호스팅 비용 등을 감당할 수 있으면 애드센스 배너 광고는 제거했으면 하는 바람입니다.

워드프레스에서 HTTP/S 요청을 줄이는 방법

워드프레스에서 HTTP 요청수를 줄이는 방법으로 wpmudev 사이트에서는 다음과 같은 사항을 제시하고 있습니다.

  • 불필요한 이미지 삭제 - 사용하지 않는 이미지 삭제
  • 불필요한 파일 삭제 - 플러그인, 테마 등 사용하지 않는 것이 있다면 삭제
  • 파일 크기 줄이기 - 워드프레스 이미지 최적화 플러그인 WP Smush 참고
  • CSS Image Sprite 생성 - https://www.w3schools.com/css/css_image_sprites.asp 참고
  • 레이지 로딩(지연 로딩) 사용
  • 관련성이 없는 자산(Asset) 무시 - WP Asset Cleanup plugin 플러그인 사용(아래 참고)
  • CSS 및 JavaScript 파일 병합
  • 외부 이미지 제한 - 워드프레스의 기본 댓글 시스템에서 불러오는 Gravatar 이미지가 여기에 해당하는 가장 일반적인 예라고 하네요.

Asset CleanUp: Page Speed Booster를 사용하여 HTTPS 요청 줄이기

워드프레스 속도 최적화

HTTP 요청을 줄이는 방법 중 하나로 Asset CleanUp: Page Speed Booster (이전 명칭 WP Asset CleanUp Lite) 같은 플러그인을 사용할 수 있습니다. 이 플러그인은 워드프레스 저장소에서 제공되는 무료 플러그인입니다.

이 플러그인을 설치하고 활성화한 후에 워드프레스 관리자 페이지 > WP Asset Clean Up에서 불필요한 자산(Asset)을 비활성화시킬 수 있습니다.

워드프레스 HTTP 요청 줄이기

각 옵션을 확인하여 불필요한 사항이 있다면 비활성화하여 HTTP 요청을 줄일 수 있습니다.

마치며

워드프레스 사이트 속도는 사이트 최적화, 웹호스팅 등 다양한 요소의 영향을 받습니다. 최근에 나오는 테마들은 많은 리소스를 요구하는 경우가 많으며, 간혹 웹호스팅 사양이 좋지 않아서 사이트 속도가 매우 느려지는 사례를 목격합니다. 그런 경우에는 웹호스팅 이전을 고려해볼 수 있습니다.

사이트 최적화 측정 사이트에서 사이트를 테스트했을 때 지나치게 요청수가 많으면 WP Asset CleanUp 같은 플러그인을 사용하여 HTTP 요청을 줄여볼 수 있습니다. 그래도 사이트 속도가 크게 향상되지 않는다면 전문 개발자에게 사이트 속도 최적화를 의뢰해볼 수 있습니다.

개인적으로 알고 있는 개발자가 워드프레스 사이트 최적화 작업을 하고 있는데, 이 작업도 며칠이 걸리는 쉽지 않은 작업 같습니다. (워드프레스 사이트 속도 개선 작업이 꼭 필요한 경우 여기에서 알려주시면 개발자를 소개해드릴 수 있습니다. 꼭 필요한 분만 알려주세요.)

특히 쇼핑몰과 같이 상품을 판매하는 사이트의 경우 사이트 속도가 매출과 직결될 정도로 중요합니다. 일반적인 방법으로 사이트 속도가 만족스러운 수준으로 개선되지 않는 경우 비용이 들더라도 전문가를 고용하는 것을 고려해볼 수 있을 것입니다.

워드프레스에서 HTTP/S 요청을 감소시켜 페이지 속도를 높여주는 WP Asset CleanUp 플러그인 2
구글 보고서에 따르면 3초 내안에 콘텐츠가 로딩되지 않으면 사용자의 53%가 페이지를 이탈하는 것으로 나타났다(출처).

7개 댓글

  1. 매거진 테마라서 썸네일을 많이 생기겠지만 저도 며칠 전 버전 9로 업데이트 한 후 로딩속도가 약간 늦어진 듯 한 느낌입니다.
    최적화를 시킨다고 해도 업데이트를 하면 조금은 무거워지네요..

    1. 현재 Webmini 사이트의 요청수가 189개로 많은 것 같습니다.
      불필요한 플러그인을 삭제하는 등의 조치를 취해 요청수를 줄여보시면 좋을 듯 합니다.
      이 글에서 소개한 플러그인도 한 번 사용해보시기 바랍니다.

      1. 매거진이라 그런지 이미지 리사이즈 된 것이 90개를 차지 하는 것 같네요..
        요청수를 줄이는 것은 매거진 이미지를 줄이는 것 밖에는 없는 듯 해요..ㅜㅜ
        플러그인은 필수만 사용해서..ㅋㅋ

      2. 저는 Ads Manager라는 광고를 편리하게 표시해주는 플러그인이 속도에 영향을 많이 미치는 것을 발견했습니다.

        첫 페이지에서 광고 표시 하나를 줄이니까 HTTP 요청수가 줄어들었습니다. 상단의 로고 옆 광고도 없애면 속도가 조금 더 빨라지지만, 광고를 없애니까 균형이 안 맞아서 보기가 별로 좋지 않네요.

        경험상 페이지 빌더, 슬라이더, 광고 등이 속도에 미치는 영향이 큰 것 같습니다.

      3. 이미지 리사이즈된 것이 90개란 것은 하나의 이미지에 대하여 썸네일이 90개가 생성된다는 의미인가요?

        저는 체크해보니 12개 정도 생성되네요. 90개이면 너무 과도한 것이 아닐까요?

      4. 아~~ 그건 메인에 이미지가 약 90개인데 각각 리사이즈된 이미지가 하나씩 생긴다는 말이었습니다.
        설명의 오해가 있었는 듯 해요..^^
        하나의 이미지에 리사이즈 이미지 90개면 벌써 다른 테마로 갈아 탔습니다..ㅋㅋ

      5. 첫 페이지에서 아래쪽 절반은 중복되는 것 같다는 생각이 드네요. 그런 부분은 과감하게 삭제해도 괜찮을 것 같습니다. 저는 메인 페이지를 비교적 심플하게 구성하고 있습니다. 복잡하면 사용자들이 찾기가 쉽지 않으니 좋을 것이 없지 않을까 생각되네요.

댓글 남기기

* 이메일 주소는 공개되지 않습니다.