자바스크립트 비동기 로딩으로 워드프레스 사이트 속도 개선하기

Last Updated: 2021년 04월 02일 2개 댓글

워드프레스 사이트 속도가 나오지 않아서 고민인 분들이 계실 것입니다. 워드프레스 캐시 플러그인과 최적화 플러그인을 이용하면 사이트 속도가 어느 정도 개선될 것입니다. 그리고 자바스크립트 비동기 로딩으로 사이트 속도를 더욱 향상시킬 수 있습니다.

참고로 사이트 속도에 영향을 미치는 요소들은 다양합니다. 심플한 블로그를 운영하는 경우 이 블로그에 사용된 GeneratePress와 같은 테마를 사용하면 속도면에서 빠르게 느껴질 것입니다.

아래는 제가 이용하는 방식입니다. 캐시 플러그인은 선호하는 플러그인을 그대로 사용하시면 됩니다. 시간을 조금 투자하여 세부적인 튜닝(Fine Tuning)을 하면 노력한 만큼 효과를 얻을 수 있으리라 생각합니다.

자바스크립트 비동기 로딩으로 워드프레스 사이트 속도 개선하기

워드프레스 속도 향상

워드프레스 사이트 속도가 느려서 고민인 경우 캐시 플러그인과 워드프레스 최적화 플러그인을 설치하여 세부 세팅을 하시고 Async Javascript 기능을 활성화하여 속도가 개선하는지 확인해보시기 바랍니다.

워드프레스 최적화 플러그인 Clearfy

저는 사이트 속도 개선을 위해 Cache Enabler라는 캐시 플러그인과 Clearfy라는 최적화 플러그인을 사용하고 있습니다.

참고로 캐시 플러그인과 Clearfy와 같은 Minify 플러그인을 함께 이용할 경우에는 설정이 겹치면 안 됩니다. 즉, 캐시 플러그인의 Minify 기능을 해제해야 Minify 플러그인이 제대로 작동할 것입니다.

Clearfy 유료 버전에서는 Async Javascript 기능을 포함한 추가 기능이 제공되어 속도를 더욱 개선할 수 있습니다.

워드프레스 최적화 플러그인 Clearfy - 자바스크립트 비동기 로딩

Javascript 로딩과 jQuery 로딩 모드로 Async와 Defer 중에서 선택할 수 있습니다.

Clearfy 플러그인을 사용하는 경우 특히 Performance 아래의 Minify (HTML/JS/CSS)와 Assets manager, Google services, Async Javascript 부분을 신경 써서 세팅하면 속도 개선에 도움이 될 것입니다. Minify 기능 설정을 할 때에는 사이트가 깨지지 않으면서 최대 성능을 내는 최적의 설정을 찾아보시기 바랍니다.

자바스크립트 비동기 로딩 플러그인 - Async Javascript

Clearfy 무료 버전을 이용하는 경우 Async Javascript 플러그인을 사용하여 자바스크립트 비동기 로딩 기능을 설정할 수 있습니다.

자바스크립트 비동기 로딩 플러그인 - Async Javascript

실제로 이 플러그인을 사용하여 테스트해보니 일부 사이트에서 속도가 크게 개선되는 것을 확인했습니다.

캐시 플러그인과 최적화 플러그인을 사용할 때에는 기능이 중복되는 플러그인을 여러 개 설치하지 않도록 주의하시기 바랍니다. 속도 개선에 도움이 된다고 여러 개의 Minification 플러그인을 설치하는 분들이 계십니다. 그러면 사이트 속도가 더 느려지고 사이트에 이상 증세가 나타날 수 있습니다.

Clearfy 무료 버전을 이용하는 경우에는 캐시 플러그인 + Clearfy + Async JavaScript 정도를 설치하여 튜닝해볼 수 있을 것입니다.

보너스: PHP ini 설정값이 낮으면 높여주세요

저는 사이트를 추가한 후에 가장 먼저 PHP ini 설정값을 확인하여 낮으면 조정하는 작업을 수행합니다. 메모리 제한 크기, max_execution_time 등의 설정값을 확인해보시고, 설정값이 낮은 경우 높여주시기 바랍니다.

예시:

마치며

이 블로그에는 현재 블루호스트(Bluehost)에서 호스팅되고 있습니다. 블루호스트는 저렴하게 이용할 수 있지만, 무거운 테마나 플러그인을 사용하면 사이트 최적화가 제대로 안 될 경우 속도가 느려질 우려가 있는 것 같습니다. 그런 경우 위의 조치를 취해보시면 도움이 될 것입니다.

실제로 저는 블루호스트에 호스팅되는 사이트들에 Cache Enabler + Clearfy 플러그인 무료 버전 + Async JavaScript 또는 Cache Enabler + Clearfy 유료 버전을 설치하여 운영하고 있는데, 속도가 어느 정도 개선되는 것 같습니다.

이러한 조치에도 사이트 속도가 개선되지 않으면 불필요한 플러그인을 비활성화하고 테마를 가벼운 테마로 바꾸는 등의 조치를 취해볼 수 있습니다. 그리고 중요한 사이트인 경우 속도를 향상시켜 SEO를 개선하기 위해 속도 최적화 전문가(개발자)를 고용하는 것도 고려해볼 수 있을 것입니다.

참고


2 개 댓글

Leave a Comment

  1. The7 테마는 비주얼 페이지를 사용해서 로딩 속도가 조금 늦는 것은 어쩔 수 없는 것 같습니다.
    이 포스트를 보면서 최대한 로딩 속도를 빠르게 한번 해 보아야 되겠네요..
    감사합니다

    응답