DNS prefetch is a way to speed up web pages by resolving the DNS address in advance. The use of rel = dns-prefetch indicates that the browser needs to resolve the DNS of a particular domain name before it can be called explicitly, as <Link rel = “dns-prefetch” href = “https://maxcdn.bootstrapcdn.com/”>. This code basically says: I want to decode a domain name before calling it and the domain name is “maxcdn.bootstrapcdn.com”
what is dns prefect
Purpose: The main purpose of rel = dns-prefetch is to increase the loading speed of web pages while using different fields for page resources (multiple file upload areas). By effectively conditioning the way DNS lookup times occur, it can gain in page load speed. This process is often called “DNS prefetching”.
Its definition in the W3C: “The dns-prefix link association type is used to specify a resource to use to fetch the required resources, and the user agent must resolve it as early as possible.” To review https://www.w3.org/TR/resource-hints/#dns-prefetch
Where is rel = “dns-prefetch” used?
Used in the start area of an HTML document. DNS resolution is a must-have part of a page’s loading process. DNS resolution is absolute, as is certain life situations. One of the reasons that affect the page speed is that the files used during the installation are downloaded from more than one domain. You can be sure that the DNS lookup for many domains affects the loading speed.
This means that if your page resources are located in three domains, a minimum of three DNS lookups are performed. If you install resources from ten domains, you must perform at least ten DNS lookups. For this reason, minimizing DNS requests is very important to increase page speed (but unfortunately is a detail that is often overlooked).
Where is DNS preprocessing useful?
Suppose you have a lot of js files used to load your page in the CDN zone, as well as some 3rd party items that you call js hosted on other domains (adsense, seo tools, marketing tools, etc.).
Normally, you don’t know which items the browser will try to load first in a possible scenario like this. But the sure thing you know is that you will be using your CDN. In this case, DNS preloading can give excellent results, because you are resolving the DNS beforehand using rel = dns-prefetch. This means that no matter what files the browser loads, the DNS will be resolved ahead of time, so resources load faster. DNS prerequisites basically give you more control over what your page will load by “hinting” the browser rather than leaving it to chance.
Where is DNS preprocessing not useful?
If all of your page resources are located in the same area where your html is kept. If the browser has accessed the HTML resource, it has already resolved the DNS address of that domain. If we are going to call all images, command and css files from the same domain, it doesn’t make sense to have to resolve the domain name again. In fact, doing so would be harmful. It is generally healthier to have a scheduled page than to introduce any dns-prefetch operation. It would be helpful to explore ways to reduce the domains your page is looking for rather than bringing in DNS upfront. While this is not possible for everyone and every site, ask yourself these three questions before booting DNS.
1. Do I host my page resources in different areas?
If your HTML file is at example.com, your CSS is at cdn.example.com, and your images are from xxx.cdn.com, then you are using resources from three different hubs and you might consider bringing them all to one hub. It is associated with the domain name.
2. Are my resources being summoned in a uniform manner?
If you are calling one CSS file with the name “www.example.com” and “example.com”, you will need to clear this file and ensure that all resources are called from www or non-www versions. The same is true for https-http. It is very common for us to see some resources coming from http on a https site.
3. Can I reduce the domains I use for resources?
Be sure to check if your pages are calling for things that are not used on the loaded page. Things like iconic fonts, plugins, social buttons are not yet used on every page, but they are still invoked. Find out what your pages are loading, you can use the page source viewer to see files called from different domains.
Leave a Reply