검색 최적화 로딩 속도 향상 방법중 DNS-prefetch를 사용 방법
DNS 최적화
DNS (도메인시스템, Domain Name System)은 인터넷에서 사용되는 주소체계입니다. 컴퓨터는 사람이 이해할 수 있는 도메인 이름(예: example.com)을 컴퓨터가 이해할 수 있는 IP 주소(예: 192.0.2.1)로 변환해 주는 역할을 합니다. DNS 최적화는 검색 엔진 속도를 최적화하는 방법 중 하나입니다.
검색 엔진 최적화에서 속도는 외부 참조 사이트를 연결할 때 많은 부하를 받게 됩니다. 브라우저가 페이지에 접속할 때 참조해야 하는 외부 사이트의 정보는 접속 시간과 해당 요소를 불러오는 시간을 포함합니다. 따라서 접속 지연이 발생하면 검색 엔진 최적화와 로딩 속도에 부정적인 영향을 미칠 수 있습니다.
Prefetch
Prefetch는 브라우저가 사용자가 앞으로 요청할 리소스를 사전에 불러오는 방법입니다. 사용자가 실제로 해당 리소스를 요청하기 전에 브라우저가 미리 다운로드하도록 유도합니다. DNS-prefetch는 브라우저가 외부 사이트의 도메인 이름과 IP 주소를 미리 확인하여 DNS 캐싱을 하도록 유도합니다. 이러한 캐싱 방법은 페이지의 로딩 속도를 향상시킬 수 있으며, 특히 외부 페이지의 의존도가 높은 블로그와 같은 페이지에서는 로딩 속도에 중요한 영향을 미칠 수 있습니다
HTML에서 사용할 때는 아래와 같은 코드 형식으로 지정하여 사용하면 됩니다. 제3자 도메인 리소스를 사용하는 주소를 적어 주시면 됩니다.
<link rel="dns-prefetch" href="https://tistory1.daumcdn.net/">
<link rel="dns-prefetch" href="https://t1.daumcdn.net/">
<link rel="dns-prefetch" href="https://blog.kakaocdn.net/">
<link rel="dns-prefetch" href="https://developers.kakao.com/">
<link rel="dns-prefetch" href="https://fonts.googleapis.com/" />
Preconnect
Preconnect은 브라우저가 서버와의 연결을 사전에 설정하여 로딩 시간을 최적화하는 방법입니다. 주로 다음과 같은 작업을 사전에 처리합니다:
- 서버의 도메인 이름을 IP 주소로 변환하는 과정을 사전에 처리하여 시간을 단축합니다.
- 실제 데이터 전송을 위한 TCP 연결 설정을 미리 수행합니다.
- HTTPS 프로토콜을 사용하는 경우, TLS(SSL) 연결 설정을 사전에 처리합니다.
아래는 preconnect를 사용한 예시입니다:
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://cdn.example.com" crossorigin>
위에 방법을사용할 때 주의할 점은 브라우저가 모든 리소스를 동시에 로드하려 하지 않도록 관리하는 것입니다. 너무 많은 리소스를 지정하면 오히려 성능에 부정적인 영향을 미칠 수 있습니다. 따라서 필요한 경우에만 preload와 preconnect를 사용하고, 특히 중요한 리소스에만 적용하는 것이 좋습니다.
'SEO' 카테고리의 다른 글
검색엔진 최적화중 너무 길거나 짧은 Meta Description의 문제점 (0) | 2024.07.15 |
---|---|
사이트와 블로그 효율적 코드관리 (티스토리 외부 스크립트 와 CSS 참조 자료 ) (0) | 2024.07.13 |
선별적 폰트 로딩 (◕‿◕)(폰트최적화) 검색 엔진 최적화 방법 (0) | 2024.07.09 |
검색엔진 최적화 중 CSS초기화로 변수제거와 레이아웃의 안정화 작업 (0) | 2024.07.09 |
검색엔진이 비슷한 페이지로 판단시 저품질되는 이유와 방지 방법 (0) | 2024.07.05 |