[html] dns-prefetch

개념

리소스 요청 하기 전에 도메인 정보를 분석하는것을 시도한다.

 

왜 쓰는가?

브라우저가 제 3자 서버로부터 리소스를 요청 할때, DNS resolution을 해야한다. (cross-domain의 domain을 ip로 변환).

DNS resolution 과정은 엄청난 지연시간을 초래한다.

 

Best Practices

1. dns-prefetch 는 cross-origin domain에서만 사용해야한다. 같은 도메인을 사용 하면안되. 왜냐면 이미 같은 도메인의 ip는 이미 resolve된 상태
2. preconnect와 같이 쓰면 좋다. dns-prefetch는 DNS lookup만 수행하지만, preconnect는 해당 서버와 커넥션을 만든다. (너무 많은 도메인에 connection을 생성하면, 역효과가 나올 수 있다. 제일 많이 쓰이는 부분에만 사용하자)
3. preconnect를 지원해주지 않는 브라우저가 있으므로 dns-prefect는 좀더 효과적

<link rel="dns-prefetch" href="//v-phinf.pstatic.net">

 

https://developer.mozilla.org/en-US/docs/Web/Performance/dns-prefetch

Using dns-prefetch - Web performance | MDN