WordPress에서 DNS 사전 페칭을 설정하는 방법

DNS 프리페칭으로 널리 알려진 도메인 이름 시스템 프리페칭은 사용자가 요청하기 전에 도메인 이름을 확인하는 프로세스입니다. 주로 웹사이트를 더 빨리 로드하고 전반적인 성능을 높이는 데 사용됩니다.

WordPress의 DNS 최적화는 Google Fonts, Google Analytics, Font Awesome 등의 정기적으로 요청되는 리소스를 사전 설정하여 웹사이트 로드 속도를 높이는 인기 있는 방법입니다.

이 게시물에서는 플러그인이나 수동으로 WordPress에 DNS 사전 페칭을 추가하는 방법을 알아봅니다. 이렇게 하면 다음을 수행하는 데 도움이 될 수 있습니다. WordPress 사이트가 빠르게 로드됩니다.

차례 숨기기

DNS 프리페치는 어떻게 작동하나요?

DNS 프리페칭을 사용하는 이유

WordPress에서 DNS 사전 페칭을 설정하는 방법

맺음말

DNS 프리페치는 어떻게 작동하나요?

DNS Prefetch는 백그라운드에서 작동합니다. 여러 도메인에서 리소스를 로드하는 경우. 이는 일반적으로 브라우저가 DNS 조회를 수행하는 데 약 100ms가 걸리기 때문에 웹사이트 로드 시간에 영향을 미칩니다.

즉, 리소스를 로딩하는 도메인이 5개 이하인 경우 브라우저가 조회하는 데 최대 500ms가 걸릴 수 있습니다.

하지만 DNS 프리페칭의 기능은 사용자가 해당 링크를 클릭하기 전에 해당 도메인을 백그라운드에서 로드하는 것입니다.

즉, 사용자가 이를 클릭하는 순간 리소스가 준비되고 페이지가 즉시 로드됩니다.

외부 리소스에 많이 의존하고 있다면, DNS 사전 페치 로드 시간을 개선할 수 있습니다. Google Fonts, Google Analytics 등을 사용하는 일반적인 WordPress 사이트의 경우 DNS 프리페치는 로드 시간을 최대 500ms까지 절약할 수 있습니다.

DNS 프리페칭을 사용하는 이유

사이트 로드 속도를 높이기 위해 미리 페치할 수 있는 리소스가 많이 있습니다. 여기에는 다음이 포함됩니다.

구글 글꼴
Google Analytics
CDN 주소
구글 태그 관리자
멋진 글꼴
구글지도
그리고 외부 리소스

WordPress에서 DNS 사전 페칭을 설정하는 방법

WordPress에서 DNS 사전 페칭을 활성화하려면 다음 단계를 따르세요.

1. DNS Prefetch 플러그인 설치

WordPress에서 DNS 프리페칭을 구현하는 가장 쉬운 방법은 플러그인을 사용하는 것입니다. 이렇게 하면 테마 파일을 편집해야 하는 스트레스를 덜 받을 수 있습니다.

이를 처리하는 가장 좋은 플러그인은 다음과 같습니다. PerfmattersWordPress 웹사이트 속도를 높여주는 놀라운 기능을 다양하게 갖춘 프리미엄 플러그인입니다. 또 다른 대안은 다음과 같습니다. WP Rocket.

Perfmatters의 경우 다음이 필요합니다. 해당 사이트에서 플러그인을 다운로드하세요. WordPress 대시보드에 설치하고 활성화하세요.

플러그인을 사용하지 않고 수동으로 사용하려면 바로 4번으로 넘어가세요.

2. 사전 페치할 도메인 추가

Perfmatters 플러그인을 설치하고 활성화한 후 플러그인 설정으로 가서 추가 탭을 클릭합니다. 거기서 사전 페치할 도메인을 추가할 수 있습니다.

아래 패턴에 따라 줄당 하나의 도메인만 추가해야 합니다.

//fonts.googleapis.com //www.google-analytics.com //cdnjs.cloudflare.com //www.googletagmanager.com

WP Rocket의 경우, 사전 로드 탭으로 가서 DNS 요청 사전 페치로 스크롤합니다. 거기에서 사전 페치하려는 URL을 입력할 수 있습니다. 위의 것과 동일한 패턴입니다.

3. 변경 사항을 저장합니다.

변경 사항을 저장했는지 확인하세요. 그게 전부입니다.

4. WordPress에 DNS 프리페칭을 수동으로 추가합니다.

플러그인 없이 WordPress에 DNS 사전 페칭을 수동으로 추가하려면 테마를 편집해야 합니다. functions.php.

아래 코드를 functions.php에 추가하기만 하면 됩니다. 아래 예에서 Google Analytics, Google Tag Manager, Google fonts를 가이드로 추가했습니다. 편집할 수 있고 더 추가할 수도 있습니다.

//* DNS Prefetching
function dns_prefetch() {
    echo '<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href="https://www.google-analytics.com" />
<link rel="dns-prefetch" href="https://www.googletagmanager.com" />
<link rel="dns-prefetch" href="https://fonts.googleapis.com" />
}
add_action('wp_head', 'dns_prefetch', 0);

다음과 같은 새 줄을 추가하세요.

<link rel="dns-prefetch" href="https://DOMAIN.com" />

맺음말

DNS 프리페칭은 특히 모바일 버전의 웹사이트 속도를 높일 수 있습니다. 특히 외부 리소스에 많이 의존하는 경우 차이를 느낄 수 있습니다.

이것이 사이트 속도를 높일 수 있지만 사용하는 WordPress 호스팅과 테마가 사이트 속도에 가장 중요한 요소라는 점을 기억하세요. 저는 추천합니다. 구름 WordPress 호스팅을 위해 내 것을 볼 수 있습니다 Cloudways 검토 여러 가지 이유가 있습니다. Cloudways가 당신에게 너무 힘들다면 Hostinger Bluehost 작은 웹사이트에 적합합니다.

나는 또한 추천한다. GeneratePress 테마에 대해 볼 수 있습니다 생성프레스(GeneratePress) 리뷰 이유로