前面的话

  本文将详细介绍DNS预解析prefetch的主要内容

概述

  DNS(Domain Name System, 域名系统),是域名和IP地址相互映射的一个分布式数据库。DNS 查询就是将域名转换成 IP 的过程,这个过程短的话 2ms 几乎无感,长则可能达到几秒钟

  当浏览器访问一个域名的时候,需要解析一次DNS,获得对应域名的ip地址。在解析过程中,按照浏览器缓存系统缓存路由器缓存ISP(运营商)DNS缓存根域名服务器顶级域名服务器主域名服务器的顺序,逐步读取缓存,直到拿到IP地址

  DNS Prefetch,即DNS预解析就是根据浏览器定义的规则,提前解析之后可能会用到的域名,使解析结果缓存到系统缓存中,缩短DNS解析时间,来提高网站的访问速度

使用

  现代浏览器在 DNS Prefetch 上做了两项工作:

  1、html 源码下载完成后,会解析页面的包含链接的标签,提前查询对应的域名

  2、对于访问过的页面,浏览器会记录一份域名列表,当再次打开时,会在 html 下载的同时去解析 DNS

  DNS预解析分为以下两种:

【自动解析】

  浏览器使用超链接的href属性来查找要预解析的主机名。当遇到a标签,浏览器会自动将href中的域名解析为IP地址,这个解析过程是与用户浏览网页并行处理的。但是为了确保安全性,在HTTPS页面中不会自动解析

【手动解析】

  在页面添加如下标记

<link rel="dns-prefetch" href="//img.alicdn.com">

  上面的link标签会让浏览器预取"img.alicdn.com"的解析

  希望在HTTPS页面开启自动解析功能时,添加如下标记

<meta http-equiv="x-dns-prefetch-control" content="on">

  希望在HTTP页面关闭自动解析功能时,添加如下标记

<meta http-equiv="x-dns-prefetch-control" content="off">

  并非所有页面都要手动解析,一般在整个站点的入口页做这个工作就行了,毕竟一个站点下用到的大多数域名都会在首页体现

作用

  DNS Prefetch有效缩短了DNS的解析时间

  如果浏览器最近将一个域名解析为IP地址,所属的操作系统将会缓存,下一次DNS解析时间可以低至0-1ms。 如果结果不在系统本地缓存,则需要读取路由器的缓存,则解析时间的最小值大约为15ms。如果路由器缓存也不存在,则需要读取ISP(运营商)DNS缓存,一般像taobao.combaidu.com这些常见的域名,读取ISP(运营商)DNS缓存需要的时间在80-120ms,如果是不常见的域名,平均需要200-300ms。一般的网站在运营商这里都能查询的到,所以普遍来说DNS Prefetch可以给一个域名的DNS解析过程带来15-300ms的提升,尤其是一些大量引用很多其他域名资源的网站,提升效果就更加明显了

  浏览器底层缓存进行了建模,当Chrome浏览器启动的时候,就会自动的快速解析浏览器最近一次启动时记录的前10个域名。所以经常访问的网址就没有DNS解析的延迟,打开速度更快

最后

  DNS Prefetch 是对网页性能优化的一个通用方案,对国际化的站点来说可能效果更加明显。学习成本和理解成本低,可以放心大胆地用到自己的网页上

  以小火柴的前端小站为例

<link rel="dns-prefetch" href="//api.xiaohuochai.cc"/>
<link rel="dns-prefetch" href="//static.xiaohuochai.site"/>
<link rel="dns-prefetch" href="//demo.xiaohuochai.site"/>
<link rel="dns-prefetch" href="//pic.xiaohuochai.site"/>

DNS预解析prefetch的更多相关文章

  1. 浏览器 DNS缓存与DNS prefetch (DNS预解析)

    浏览器 DNS缓存 浏览器DNS缓存的时间跟DNS服务器返回的TTL值无关. 注:TTL(Time-To-Live),就是一条域名解析记录在DNS服务器中的存留时间. 浏览器在获取网站域名的实际IP地 ...

  2. DNS Prefetch 【DNS 预解析技术】

    DNS 实现域名到IP的映射.通过域名访问站点,每次请求都要做DNS解析.目前每次DNS解析,通常在200ms以下.针对DNS解析耗时问题,一些浏览器通过DNS Prefetch 来提高访问的流畅性. ...

  3. dns-prefetch—DNS预解析技术

    今天在看一个网站的源代码时 发现了 <link rel="dns-prefetch" href="//static.tuweia.cn/"> 对dn ...

  4. DNS 预解析

    DNS 解析也是需要时间的,可以通过预解析的方式来预先获得域名所对应的 IP. <link rel="dns-prefetch" href="//yuchengka ...

  5. DNS预解析dns-prefetch提升页面载入速度优化前端性能

    当浏览器请求一个URL的时候,通过firebug我们可以发现大概有以下几个过程:阻挡.域名解析.建立连接.发送请求.等待响应.接收数据.后面四个跟用户的网络情况和你的服务器处理速度有关,本文重点说说前 ...

  6. 网站优化,dns预解析,解析缓存

    DNS Prefetch 是一种 DNS 预解析技术.当你浏览网页时,浏览器会在加载网页时对网页中的域名进行解析缓存,这样在你单击当前网页中的连接时就无需进行 DNS 的解析,减少用户等待时间,提高用 ...

  7. 前端优化:DNS预解析提升页面速度

    在网页体验中我们常会遇到这种情况,即在调用百度联盟.谷歌联盟以及当前网页所在域名外的域名文件时会遇到请求延时非常严重的情况.那么有没有方法去解决这种请求严重延时的现象呢? 一般来说这种延时的原因不会是 ...

  8. 前端性能优化之-dns预解析

    预解析的实现: 1. 用meta信息来告知浏览器, 当前页面要做DNS预解析:<meta http-equiv="x-dns-prefetch-control" conten ...

  9. 前端性能优化-减少http请求,dns预解析,减少repaint和reflow

    前端性能优化方法: 一 . 减少http请求 (1)通过合并图片,减少请求,俗称css sprites(css精灵)css sprites (2)lazyload懒加载,在需要的时候再加载 1.定义: ...

随机推荐

  1. ASP.NET Core - 从Program和Startup开始

    Program 我们先看一下1.x和2.x的程序入口项的一个差异 1.x public class Program { public static void Main(string[] args) { ...

  2. Java服务器内存过高&CPU过高问题排查

    一.内存过高 1.内存过高一般有两种情况:内存溢出和内存泄漏 (1)内存溢出:程序分配的内存超出物理机的内存大小,导致无法继续分配内存,出现OOM报错 (2)内存泄漏:不再使用的对象一直占据着内存不释 ...

  3. SLAM+语音机器人DIY系列:(二)ROS入门——3.在ubuntu16.04中安装ROS kinetic

    摘要 ROS机器人操作系统在机器人应用领域很流行,依托代码开源和模块间协作等特性,给机器人开发者带来了很大的方便.我们的机器人“miiboo”中的大部分程序也采用ROS进行开发,所以本文就重点对ROS ...

  4. 搞懂MySQL分区

    一.InnoDB逻辑存储结构 首先要先介绍一下InnoDB逻辑存储结构和区的概念,它的所有数据都被逻辑地存放在表空间,表空间又由段,区,页组成. 段 段就是上图的segment区域,常见的段有数据段. ...

  5. Git认证方式https和ssh的原理及比较

    常见的代码托管平台GitHub.GitLab和BitBucket等,基本都会使用Git作为版本控制工具.平台一般都提供两种认证方式https和ssh.了解该过程能够更加自由的配置和使用,本文就来简单聊 ...

  6. Python3+Selenium2完整的自动化测试实现之旅(一):自动化测试环境搭建

    1     环境搭建准备 (1)    下载Python3版本的安装包,直接官网下载即可:Python官网:https://www.python.org/ (2)    下载Python的基础工具包p ...

  7. 几分钟搞定redis存储session共享——设计实现

    前面我们写过C#在redis中存储常用的5种数据类型demo,没看过的可以点击电梯直达:https://www.cnblogs.com/xiongze520/p/10267804.html 我们上一篇 ...

  8. JavaScript小记二则:接上一节:用.net写Textbox控件关于数字的判断的另一则方法

    方法二.通过写JS进行判断控制输入的只能为数字,源码如下: <!DOCTYPE html> <html> <body> <h1></h1> ...

  9. 你必须知道的.net读书笔记之第二回深入浅出关键字---对抽象编程:接口和抽象类

    请记住,面向对象思想的一个最重要的原则就是:面向接口编程. 借助接口和抽象类,23个设计模式中的很多思想被巧妙的实现了,我认为其精髓简单说来就是:面向抽象编程. 抽象类应主要用于关系密切的对象,而接口 ...

  10. netty的好处

    netty作为一个高性能的异步通信框架,它到底有哪些好处了,又用到哪些基础技术呢? 1.使用ServerBootstrap 作为netty服务端的启动辅助类,并且在创建ServerBootstrap时 ...