浏览器及其内核工作原理

一、浏览器工作原理

 

浏览器	浏览器内核
IE	Trident内核
Firefox	Gecko内核
Safari/Chrome	Webkit内核
Opera	Presto内核
现在Chrome内核是Blink	Blink内核

 

1.启动

•  启动应用（老板开公司）

•  计算机创建进程（创建一个公司）

•  操作系统分配内存（找场地）

•  应用创建线程（找工人）

2.关闭

•   关闭应用（倒闭）

•   结束进程（场地关闭）

•   释放内存（场地空闲出来）

节省内存：

浏览器限制了最大进程数，达到限制，新开的tab页面会共用之前相同站点的渲染进程

 

二、内核工作原理

 

内核：渲染引擎和js引擎。

 

渲染引擎：

用来显示请求的内容，如果请求内容为html，那么负责解析html及css并将解析后的结果显示出来。还可以解析xml文件。

js引擎：

用来解释执行js代码。

 

渲染流程：

 

用户输入URL整个过程发生了什么？

•   输入url

•   浏览器解析url，获得主机名

•   将主机名转换成服务器ip地址（查找本地DNS缓存列表，如果没有则向默认的DNS服务器发送查询请求）

•    TCP 连接：TCP 三次握手，简易描述三次握手 客户端：服务端你在么？ 服务端：客户端我在，你要连接我么？ 客户端：是的服务端，我要链接。 连接打通，可以开始请求

•   发送 HTTP 请求

•   服务器处理请求并返回 HTTP 报文

•   浏览器解析渲染页面

•   断开连接：TCP 四次挥手

 

浏览器解析渲染页面过程：

•   解析HTML，生成DOM树

•   解析CSS，生成CSSOM（层叠样式表模型：CSS Object Model）树

•   将DOM树和CSSOM树关联，生成渲染树(Render Tree)

•   布局render树（Layout/reflow），负责各元素尺寸、位置的计算

•   绘制render树（paint），绘制页面像素信息

•   将像素发送给GPU(图形处理器，是显卡的核心引擎)，展示在页面上。(Display)