dns-prefetch란 무엇입니까? 프런트엔드 최적화: DNS 사전 구문 분석으로 페이지 속도 향상_HTML/Xhtml_웹 페이지 제작

DNS 프리패치란

DNS는 도메인 이름을 IP로 매핑하는 기능을 구현합니다. 도메인 이름을 통해 사이트에 액세스할 때 각 요청에 대해 DNS 확인이 필요합니다. 현재 각 DNS 확인에는 일반적으로 200ms 미만이 소요됩니다. 시간이 많이 걸리는 DNS 확인 문제에 대응하여 일부 브라우저는 DNS 프리페치를 사용하여 액세스의 원활성을 향상합니다.
DNS 프리페치는 웹페이지를 탐색할 때 웹페이지를 로드할 때 브라우저가 웹페이지의 도메인 이름을 구문 분석하고 캐시하므로 클릭 시 DNS 확인을 수행할 필요가 없습니다. 현재 웹 페이지에 연결하면 사용자 대기 시간이 줄어들고 사용자 경험이 향상됩니다.
현재 DNS 프리페치를 지원하는 브라우저에는 google chrome 및 firefox 3.5가 포함됩니다.
브라우저가 특정 도메인 이름을 확인하도록 하려면 페이지에 링크 태그를 추가하면 됩니다. 예:

브라우저 측에서 도메인 이름을 미리 확인하는지 여부를 제어하려는 경우 , Http를 사용할 수 있습니다. 헤더의 x-dns-prefetch-control 속성이 제어됩니다.
안타깝게도 현재 Google Chrome과 Firefox 3.5에서만 위 태그를 지원하고 있습니다

일반적으로 이러한 지연의 원인은 상대방 웹사이트의 대역폭이나 부하가 아닌데 정확히 원인이 무엇인지 무슨 상황인지 알 수 있습니다. ? Zhan Lan은 DNS 문제라고 가정하고 추측을 시도했습니다. 왜냐하면 DNS 확인 속도가 아마도 리소스 지연의 가장 큰 원인이었기 때문입니다. 그래서 Zhanlan은 (DNS 사전 확인을 위해) 페이지 헤더에 다음 코드를 추가했습니다:

< 링크 rel="dns-prefetch" href="http://img.jb51.net" />

효과가 매우 좋고(테스트 브라우저는 IE8), 다른 페이지를 열 때 바이두 공유 버튼 로딩이 대폭 개선되었습니다!

dns-prefetch에 대해 간단히 살펴보겠습니다.

DNS는 인터넷의 기본 프로토콜로, 웹사이트 최적화 프로그램에서는 해결 속도를 쉽게 무시하는 것 같습니다. 오늘날 대부분의 새로운 브라우저는 DNS 확인에 최적화되어 있습니다. 일반적인 DNS 확인에는 20~120밀리초가 소요됩니다. DNS 확인 시간과 빈도를 줄이는 것이 좋은 최적화 방법입니다. DNS 프리페칭은 사용자가 링크를 클릭하지 않고도 이 속성이 있는 도메인 이름이 백그라운드에서 구문 분석되는 것을 의미합니다. 도메인 이름 확인 및 콘텐츠 로드는 직렬 네트워크 작업이므로 이 방법을 사용하면 사용자의 대기 시간을 줄이고 사용자 경험을 향상시킬 수 있습니다.
웹사이트에 대한 브라우저의 첫 번째 도메인 이름 DNS 확인 검색 프로세스는 다음과 같습니다.

브라우저 캐시-시스템 캐시-라우터 캐시-ISP DNS 캐시-재귀 검색

도메인 이름 DNS 확인 및 검색 프로세스

Chrome에는 DNS 프리페칭 기술이 내장되어 있으며 Firefox 3.5에서도 이 기능이 도입되었습니다. Chrome과 Firefox 3.5 자체에는 DNS 프리페칭 설정이 최적화되어 있으므로 DNS 프리페칭 설정의 부작용 중 하나는 Google의 성능을 저하시킬 수 있다는 것입니다. . Chrome 브라우저 및 Firefox 3.5 브라우저의 사용자 환경입니다.

사전 구문 분석 구현:

1. 메타 정보를 사용하여 현재 페이지를 DNS 사전 확인해야 함을 브라우저에 알립니다.
2. 페이지 헤더의 링크 태그를 사용하여 DNS 사전 확인을 강제합니다.

참고: dns-prefetch는 주의해서 사용해야 합니다. 여러 페이지에서 DNS 사전 확인을 반복하면 반복되는 DNS 쿼리 수가 늘어납니다.
PS: DNS 사전 확인은 주로 웹 사이트 프런트 엔드 페이지 최적화에 사용됩니다. SEO에서의 역할은 아직 확인되지 않았습니다. 그러나 사용자 경험 향상의 일환으로 rel="dns-prefetch"의 가치는 낮아질 수 있습니다. 발견.