浏览器是我们前端开发者工作的平台，是我们最长用的软件，是我们必须要了解的知识面，做个学习记录。
现在人都离不开网络，在网上我们能干很多事情，用途最多的就是浏览器，它是一扇窗户，打开这扇窗户可以看到大千世界的变化，是人类获取信息重要的软件工具之一。对于单纯的使用者只知道怎么使用浏览器去上网冲浪，而对于前端开发者需要了解这个浏览器是怎么让我们可以自由的在网络世界遨游，它是怎么实现大千世界信息的展示的?分析开始。。。
什么是浏览器？
按专业的描述: 是指可以显示网页服务器或者文件系统的HTML文件内容，并让用户与这些文件交互的一种软件。它用来显示在万维网和局域网等内的文字、图像及其他信息。
浏览器种类：
按照浏览器的内核种类分类，
Trident内核：微软IE（坑货）,MaxThon,TT,The World,360,搜狗浏览器等，这种浏览器内核是IE浏览器用的内核，后来被其他浏览器厂商拿去延用，因2005年与W3C组织所制定的标准发生了脱节，导致对网页新元素兼容不是太好，其自身内核也存在bug。
Gecko内核: Netscape6及以上版本，Firefox,MozillaSuite/SeaMonkey等，是网景早期自助研发的浏览器内核，这个内核的优点就是功能强大、丰富，可以支持很多复杂网页效果和浏览器扩展接口，但是要消耗很多的资源，比如内存。
Presto内核：Opera7及以上,Presto内核被称为公认的浏览网页速度最快的内核,优点：在处理JS脚本等脚本语言时，会比其他的内核快3倍左右。缺点：为了达到很快的速度而丢掉了一部分网页兼容性。
Webkit内核：Safari,Chrome等，优点：网页浏览速度较快，虽然不及 Presto 但是也胜于 Gecko 和 Trident。 缺点：对于页面容错性较差，会使一些编写不标准的网页无法正确显。
它们瓜分着当今社会浏览器使用的市场份额。
浏览器主要构成：
1. 用户界面－ 包括地址栏、后退/前进按钮、书签目录等，也就是你所看到的除了用来显示你所请求页面的主窗口之外的其他部分
2. 浏览器引擎－ 用来查询及操作渲染引擎的接口
3. 渲染引擎－ 用来显示请求的内容，例如，如果请求内容为html，它负责解析html及css，并将解析后的结果显示出来
4. 网络－ 用来完成网络调用，例如http请求，它具有平台无关的接口，可以在不同平台上工作
5. UI 后端－ 用来绘制类似组合选择框及对话框等基本组件，具有不特定于某个平台的通用接口，底层使用操作系统的用户接口
6. JS解释器－ 用来解释执行JS代码
7. 数据存储－ 属于持久层，浏览器需要在硬盘中保存类似cookie的各种数据，HTML5定义了web database技术，这是一种轻量级完整的客户端存储技术
这张图大体上说了一下浏览器内部工作流程，不是全部浏览器都是这样的工作形态出现，有的流程走的路线不一样的。
从用户界面开始细说整个浏览器的工作流程，首先用户发起URL请求，这是开始浏览器工作流的第一步。
浏览器对url及编码解析：
大体流程说明如下：
1.浏览器向DNS服务器发送查找的URL输入URL对应的IP地址
2.DNS服务器返回网站的IP地址
3.浏览器根据IP地址与WEB服务器在的80端口上建立TCP连接
4.浏览器获取请求的页面HTML代码
5.浏览器在窗体渲染HTML
在这过程中再深入看下DNS查找IP操作：
DNS查找过程：
1.浏览器缓存：浏览器会缓存DNS记录一段时间，但操作系统没有告诉浏览器存储DNS的时间，这样不同的浏览存储缓存时间不固定（2分钟--30分钟不固定）
2.系统缓存：如果在浏览器缓存没有找到需要的记录时，则浏览器会做一个系统调用（windows里是用gethostbyname）。这样就可以获得系统中的缓存
3.路由缓存：浏览器向DNS服务器请求路由器，它一般会有自己的DNS缓存
4.ISP DNS缓存：接下来要check的就是ISP缓存DNS的服务器。在这一般都能找到相应的缓存记录
5.递归搜索：你的ISP的DNS服务器从跟域名服务器开始进行递归搜索，从.com顶级域名到facebook域名服务器，一般DNS服务器的缓存中会有.com域名服务器中的域名，所以到顶级服务器的匹配过程不是那么必要了
URL编码解析:
如果url路径中带有中文，这个时候就能看出浏览器对url的编码设置了，
URL例子：http://106.kuailingmin.sinaapp.com/蒯灵敏
因为IE会直接发送GBK编码的参数，在后台需要另外处理，而Firefox则以页面编码做Base64转义,URL例子中的中文会变成http://106.kuailingmin.sinaapp.com/%E8%92%AF%E7%81%B5%E6%95%8F
上面大体这么多，接下来DNS返回了IP地址的响应，这个时候会把页面中的元素都返回过来，浏览器要去接受这些数据，在这个过程中就会触发浏览器排版引擎的工作，分析下什么时候浏览器排版引擎？
什么是排版引擎：
网页的排版引擎称之为渲染引擎，主要负责获取网页的内容（HTML,图像,XML等等），整理信息（加入CSS文件），以及计算网页的显示方式然后输出到显示器，或者打印机设备，所有的网页浏览器，电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要排版引擎。
这个是个重要的工作机制，目前几个大浏览器厂商根据自己需求，研发自己的排版引擎，有些浏览器厂商则直接引擎这几大排版引擎，（省事，省时，省力，省钱）。
排版引擎分类：
1.IE派: IE永远不会用别人的东西，所以在浏览器任何环节都喜欢自主研发，目前是最流行的排版引擎，(世界之窗浏览器，Avant,腾讯TT,Netscape 8,NetCaptor,GreenBrowser等...)
Trident（图形接口的排版引擎）
又称之为MSHTML,是IE浏览器的排版引擎，简单了解下发展史：第一版本诞生于1997年10月，之后不断的加入新技术，到IE7版的时候，微软对Trident排版引擎做了重大的变动，除了加入新技术之外，还对网页标准支持。其设计成一个软件组件形式
Gecko排版引擎：
流行程度仅次于Trident,d诞生于1998年初，Mozilla计划开始执行。这个新的排版引擎名为Raptor，以开发源码的方式发放于互联网上。后来，因为商标问题，Raptor改外 为NGLayout（即next generation layout之意）。而最后NGLayout就被网景重新命名为Gecko。
Gecko兼容的标准:
* HTML 4.01
* XML 1.0
* XHTML 1.1
* MathML
* CSS Level 1（支援部份CSS 2和3）
* DOM Level 1和2（支援部份DOM 3）
* RDF
* JavaScript 1.7
* E4X
* SVG（支援部份SVG 1.1）
KHTML排版引擎：
该引擎是C++编写的，并以LGPL授权，支援大多数网页浏览标准,此优点拥有速度快捷的优点
引擎兼容标准：
* HTML 4.01
* CSS 1
* CSS 2.1 （paged media除外）
* CSS 3 选择符（selector）及部分其他功能
* PNG, MNG, JPEG, GIF 图形格式
* DOM 1, 2 及部分的 DOM 3
* ECMA-262/JavaScript 1.5
* 部分 SVG
还有很多排版引擎 比如说（混合排版引擎，Blink排版引擎,纯文字排版引擎）,主要用于在PC端，手机端，浏览器排版引擎就总结这几类，大体知道有这些的概念，然后就是HTML怎么通过排版引擎解析的？
首先有经验的前端开发都知道浏览器解析HTML文档都是从第一行开始一行一行往下解析的，在这个过程中，再深入的研究,hmtl不能被一般的自顶向下或自底向上的解析器所解析，也不能使用正则解析技术，浏览器有专门的HTML解析器