- 01-15 – 減少DNS查詢
第一部分 – 第15章
減少DNS查詢的數量並啟用keep-alive通常可以提升移動網站頁面的加載速度。
DNS查詢是什麼
DNS(domain name system)查詢可以將主機名映射到IP 地址中。例如:
- 當用戶在網絡瀏覽器中輸入m.example.com時, 網絡瀏覽器便聯繫上一個DNS解析,這個DNS解析會返回服務器的IP地址。
- DNS有一個缺點。對於網絡瀏覽器為任意主機名查找IP地址,一個DNS查詢可能消耗100-200毫秒。
- 在DNS查詢完成之前,網絡瀏覽器將無法從該主機名處下載任何文件。
- 響應時間取決於DNS解析器(一般由用戶的網絡服務商提供),其負載的請求量,用戶與網站服務器的距離,以及帶寬速度。
示例
例如,有一個網頁,其URL為m.example.com/page-xyz.html。當加載這個頁面時,相比較m.example.com,還需要從其他4個主機名處請求資源文件。
- css.example.com
- js.example.com
- images.example.com
- www.example-2.com
<head> <link rel="stylesheet" href="http://css.example.com/style.css" /> <link rel="stylesheet" href="http://www.example-2.com/style2.css" /> <script src="http://js.example.com/script.js"></script> <script src="http://www.example-2.com/script2.js"></script> </head> <body> <!-- Page Content --> <div><img src="http://images.example.com/image-1.png"></div> <div><img src="http://images.example.com/image-2.png"></div> <div><img src="http://images.example.com/image-3.png"></div> <div><img src="http://www.example-2.com/image-4.png"></div> <!-- Some More Page Content --> </body>
啟用Keep-alive
當網絡瀏覽器從同一個主機處請求多個資源文件時,Keep-alive是一個持續的連接,也是一個保持網站服務器與網絡瀏覽器之間的連接處於活動狀態的方法。
對於移動網站頁面需要下載的任何資源文件,網絡瀏覽器都必須對頁面獲取資源文件的每個域名至少查詢一次。
當keep-alive對網絡瀏覽器被禁用時,便要求進行如下的DNS查詢。在這個例子中,由於keep-alive被禁用,請求8個資源文件需要進行8次DNS查詢。
- css.example.com (x 1 time)
- js.example.com (x 1 time)
- images.example.com (x 3 times)
- www.example-2.com (x 3 times)
當keep-alive對網絡瀏覽器被啟用時,只需要更少的DNS查詢。在這個例子中,由於keep-alive被啟用,請求8個資源文件僅需要進行4次DNS查詢。
- css.example.com (x 1 time)
- js.example.com (x 1 time)
- images.example.com (x 1 time)
- www.example-2.com (x 1 time)
啟用keep-alive可以減少下載資源文件所需要的DNS的查詢數量,並將提升頁面的加載速度。
Keep-alive是網站服務器特性。根據你的移動網站選用的網站服務器,在Apache和Nginx上啟用keep-alive需要設置不同的指令。
在Apache上啟用Keep-alive
為了在Apache上啟用keep-alive,需要添加如下代碼到.htaccess文件。
<ifModule mod_headers.c> Header set Connection keep-alive </ifModule>
在Nginx上啟用Keep-alive
為了在Nginx上對所有網絡瀏覽器啟用keep-alive,使用HttpCoreModule並確保“keepalive_disable”指令被分配成none。例如:
keepalive_disable none; # allow all web browsers to use keepalive
向更少的主機名請求
在之前m.example.com/page-xyz.html網頁的示例中,使用了4個主機名來存儲資源文件。
- css.example.com
- js.example.com
- images.example.com
- www.example-2.com
當keep-alive已打開時,你可以遷移所有的資源文件,使所有文件位於一個單一的主機名resources.example.com。這種設置將使DNS查詢減少為1次。
如下是在變更為全部使用一個主機名存儲資源文件後的網站頁面代碼。
<head> <link rel="stylesheet" href="http://resources.example.com/style.css" /> <link rel="stylesheet" href="http://resources.example.com/style2.css" /> <script src="http://resources.example.com/script.js"></script> <script src="http://resources.example.com/script2.js"></script> </head> <body> <!-- Page Content --> <div><img src="http://resources.example.com/image-1.png"></div> <div><img src="http://resources.example.com/image-2.png"></div> <div><img src="http://resources.example.com/image-3.png"></div> <div><img src="http://resources.example.com/image-4.png"></div> <!-- Some More Page Content --> </body>
示例
例如,移動網站頁面(m.yhd.com)的加載要求2次DNS查詢,每個都是從一個不同的主機名處查詢。
- 主機1: m.yhd.com
- 主機2: image.yihaodian.com
在網絡瀏覽器開始下載真正的資源文件之前,每個DNS查詢都耗費了一定量的時間。
- 上一章:部署CSS精靈
- 下一章:優化CSS和JavaScript的加載順序
移動網站性能技術白皮書在2017年3月正式出版。
英文版:Reduce DNS Lookups – 簡體中文版:減少DNS查詢
移動網站性能技術白皮書上的內容按下列許可協議發布: CC Attribution-Noncommercial 4.0 International