DNS preheating

A DNS resolution takes 20-120ms. When a web page has a large number of domain names, the time saved by DNS preheating is considerable

Look at the effect

Purpose of preheating:

  1. Reduce the number of requests
  2. Obtain DNS data in advance

How to do these two things

Let’s take a look at the DNS resolution process: browser cache – system cache – router cache -ISP DNS cache -DNS source server, as shown in the following figure:

We see from the graph, when we visited a domain name, will generate the DNS cache on each node, DNS preheating is completed, so the same area (or Internet service provider) other users to access the domain again don’t need to go back to the source, directly read the recent DNS cache, thus reducing the number of requests, improved the website access speed.

Way of preheating

  1. The crawler
  2. APP
  3. Web page meta
    <meta http-equiv="x-dns-prefetch-control" content="on" />
    <link rel="dns-prefetch" href="//webresource.english.c-ctrip.com" />
    <link rel="dns-prefetch" href="//webresource.c-ctrip.com" />
    <link rel="dns-prefetch" href="//s.c-ctrip.com" />
    <link rel="dns-prefetch" href="//pic.english.c-ctrip.com" />
    <link rel="dns-prefetch" href="//m.ctrip.com" />
Copy the code

In addition, this is especially necessary for international sites. For example, if you visit a Chinese site in the United States, the DNS resolution will be returned to the source in China, which usually takes 400ms to 800ms or longer. If you preheat this time, you can save this time.

Merging HTTP requests

The merge here is mainly for the resource files that are accessed on the current page, such as CSS, JS, images, etc.

Why merge requests?

One wonders, why do this when modern browsers can request resources concurrently? All I can say is that you are too young too simple. Although the browser can be concurrent, but the PC access to the Internet bandwidth is limited, the browser can use TCP links is more limited, I look at a web request example:

See, a 2KB resource takes about 0.5s to load and 99% of the time is waiting. OMG! So what’s the struggle? Just webpack it together.

Note that Chrome can have different number of concurrent requests for the same domain name under HTTP and HTTPS: HTTP = 6, HTTPS > 13; HTTP = 6, HTTPS > 13; HTTP = 6, HTTPS > 13; HTTP = 6; (Who knows can leave a message to inform, thank you!)

More reference

  • The number of concurrent browser requests for static resources