浏览器内核可以分为两部分: 

1. 渲染引擎

2. JS引擎

 

渲染引擎的作用是将html代码和css代码解析为用户看到的网页. JS引擎的作用是读取网页中的js代码并执行它. 

下面是常见的渲染引擎和JS引擎:

浏览器名称    渲染引擎    JS引擎

Firefox      Gecko     SpiderMonkey

Safari        WebKit      SquirrelFish

Chrome       Blink       V8

IE        Trident       IE9之前使用 Jscript, IE9之后使用 Chakra

Edge        EdgeHTML     Chakra

 

-------------------------------------------------------------------------------------------------------------------------------------------------

 

1. 渲染引擎

对于渲染引擎来讲, 他的工作主要是下面这四步: 

第一步: 解析代码, 将html代码解析为DOM, 将CSS代码解析为CSSOM;

第二步: 对象合成, 将DOM和CSSOM合成为一棵渲染树;

第三步: 布局, 计算出渲染树的位置;

第四步: 绘制, 将渲染树绘制到屏幕上;

 

这四步并非严格按照顺序执行, 不是说第一步完成以后才执行第二步, 而是边下载 / 边解析 / 边合成 / 边布局 /边绘制.

 

2. JS引擎

对于JS引擎来讲, 他的工作主要是下面这四步: 

第一步: 读取代码, 进行词法分析, 将代码分解为词元;

第二步: 对词元进行语法分析, 并将代码整理成语法树;

第三步: 使用翻译器, 将代码转换为字节码;

第四步: 使用字节码解释器, 将字节码转换为机器码并执行;

 

这里的第三步和第四步在目前有所改变, 引入了即时编译技术(JIT), 生成的字节码只会在执行到相应位置, 才会将其编译为机器码, 并将结果缓存, 这样做的目的其实是遵循了代码功能使用中的二八定律, 可以显著提升程序的运行速度.

发布评论
IT源码网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!

怎样实现脚本的动态加载讲解
你是第一个吃螃蟹的人
发表评论

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。