浏览器内核与js引擎

简介: 摘要:   面试一个大公司的时候问到了一个问题,让我谈谈主要的浏览器内核以及他们的特点,当时并没有详细的回答,回来之后自己在网上找了找资料,总结了下分享给大家。 简介:    在维基百科上是这样介绍浏览器内核的,网页浏览器的排版引擎(Layout Engine或Rendering Engine)也被称为浏览器内核、页面渲染引擎或模板引擎,它负责取得网页的内容(HTML、XML、图像等等)、整理消息(例如加入CSS等),以及计算网页的显示方式,然后会输出至显示器或打印机。

摘要:

  面试一个大公司的时候问到了一个问题,让我谈谈主要的浏览器内核以及他们的特点,当时并没有详细的回答,回来之后自己在网上找了找资料,总结了下分享给大家。

简介:

   在维基百科上是这样介绍浏览器内核的,网页浏览器的排版引擎(Layout Engine或Rendering Engine)也被称为浏览器内核、页面渲染引擎或模板引擎,它负责取得网页的内容(HTML、XML、图像等等)、整理消息(例如加入CSS等),以及计算网页的显示方式,然后会输出至显示器或打印机。所有网页浏览器、电子邮件客户端以及其它需要根据表示性的标记语言(Presentational markup)来显示内容的应用程序都需要排版引擎。

浏览器内核:

  现时主要的四大排版引擎为:Trident(应用于Internet Explorer);Gecko(应用于Mozilla Firefox);Blink(应用于Chrome );WebKit (应用于Apple Safari和早期版本的Google Chrome)。

内核 是否开源 插件支持 应用浏览器 支持操作系统
Trident 否,但提供接口调用 ActiveX IE Windows
Gecko 是,多种协议授权发行,包括MPL、GPL、LGPL NPAPI Firefox Windows,Mac,Linux/BSD
Blink NPAPI Chrome,Opera Windows,Mac,Linux/BSD
Webkit 是,遵从LGPL协议 NPAPI Chrome,Safar Windows,Mac,Linux/BSD

 

  因为这些排版引擎都有其代表的浏览器,所以常常会把排版引擎的名称和浏览器的名称混用,比如常的说IE内核、Chrome内核。其实这样子是不太合理的,因为一个完整的浏览器不会只有一的排版引擎,还有自己的界面框架和其它的功能支撑,而排版引擎本身也不可能实现浏览器的所有功能。下面罗列一下几款主流的排版引擎和浏览器。

1、Trident(Windows)

Trident 就是大名鼎鼎的 IE浏览器 所使用的内核,也是很多浏览器所使用的内核,通常被称为IE内核。基于Trident内核的浏览器非常多,这是因为Trident内核提供了丰富的调用接口。老的Trident内核(比如常说的IE6内核)一直是不遵循W3C标准的,但是由于当时IE6的市场份额最大,所以后果就是大量的网页专门为IE6等老Trident内核编写,在IE6下显示很正常,但其实这些网页的代码并不符合W3C标准,于是,完全依据W3C标准写的网页在老的Trident内核下面又出现偏差,这就是为什么很多人觉得后来的IE9的网页排版有时会乱了,而IE6则正常,其实不是浏览器兼容性差了,而是你访问的网页不符合新的标准。目前可供调用的最新版的Trident内核是IE9所用的内核,相较之前的版本对W3C标准的支持增强了很多。 

Trident内核的常见浏览器有: IE6、IE7、IE8(Trident 4.0)、IE9(Trident 5.0)、IE10(Trident 6.0); 

世界之窗、 360安全浏览器、傲游;搜狗浏览器;腾讯TT;阿云浏览器(早期版本)、百度浏览器(早期版本)、瑞星安全浏览器、Slim Browser; GreenBrowser、爱帆浏览器(12 之前版本)、115浏览器、155浏览器; 闪游浏览器、N氧化碳浏览器、糖果浏览器、彩虹浏览器、瑞影浏览器、勇者无疆浏览器、114浏览器、蚂蚁浏览器、飞腾浏览器、速达浏览器、佐罗浏览器; 

其中部分浏览器的新版本是“双核”甚至是“多核”,其中一个内核是Trident,然后再增加一个其他内核。国内的厂商一般把其他内核叫做“高速浏览模式”,而Trident则是“兼容浏览模式”,用户可以来回切换。 

2、Gecko(跨平台) 

Netscape6 启用的内核,现在主要由Mozilla基金会进行维护,是开源的浏览器内核,目前最主流的Gecko内核浏览器是Mozilla Firefox,所以也常常称之为火狐内核。因为Firefox的出现,IE的霸主地位逐步被削弱,Chrome的出现则是加速了这个进程。非Trident内核的兴起正在改变着整个互联网,最直接的就是推动了编码的标准化,也使得微软在竞争压力下不得不改进IE。不过比较可惜的是,虽然是开源的,也开发了这么多年,基于Gecko的浏览器并不多见,除了一些简单的改动(坑爹的X浏览器)或者是重新编译(绫川ayakawa、tete009),深度定制或者增强型外壳的还比较少见。另外就是有一些其它软件借用了Gecko内核,比如音乐管理软件SongBird。常见的Gecko内核的浏览器:Mozilla Firefox、Mozilla SeaMonkey、Epiphany(早期版本)、Flock(早期版本)、K-Meleon 

3、KHTML(Linux) 

KDE开发的内核,速度快捷,容错度低。这个内核可能不见得很多人知道,但是后面再看下去你就明白了。常见的KHTML内核的浏览器:Konqueror 

4、WebKit(跨平台) 

由KHTML发展而来,也是苹果给开源世界的一大贡献。是目前最火热的浏览器内核,火热倒不是说市场份额,而是应用的面积和势头。因为是脱胎于KHTML,所以也是具有高速的特点,同样遵循W3C标准。从目前看来,WebKit 内核是最有潜力而且是已经有相当成绩的新兴内核,性能非常好,而且对W3C标准的支持很完善。 当前发展势头最强劲的WebKit内核,常见的WebKit内核的浏览器:Apple Safari (Win/Mac/iPhone/iPad)、Symbian手机浏览器、Android 默认浏览器,

5、Chromium(跨平台) 

其实 Chromium 就是 WebKit,维基百科里面并没有将Chromium从WebKit分出来,这个区分完全是基于我个人的恶趣味。记得以前看过一个大牛的博文说过,Chromium把WebKit的代码梳理得可读性提高很多,所以以前可能需要一天进行编译的代码,现在只要两个小时就能搞定。这个我自己也没有考究过,但是估计可信。这个也能解释为什么Gecko和WebKit出来了这么久,第三方编译、定制的版本并不多,但是由Chromium衍生出来的浏览器早就满坑满谷了。 常见的Chromium内核的浏览器:Google Chrome、Chromium、SRWare Iron、Comodo Dragon 

6、Presto(跨平台) 

Opera 所采用的内核,准确地说,是Opera 7.0及以后版本的内核,Opera 3.5-6.1版本使用的内核叫做Elektra。不用说,Presto对W3C标准的支持也是很良好的。虽然我很喜欢Opera,但是我对Presto的渲染速度一直有保留态度。之前在OperaChina论坛看见有人说过,Presto优先解析文字,保证可阅读性,媒体资源的渲染放后。常见的Presto内核的浏览器:Opera 

7、Blink(跨平台)

Blink是一个由Google和Opera Software开发的浏览器排版引擎,Google计划将这个渲染引擎作为Chromium计划的一部分,并且在2013年4月的时候公布了这一消息[1]。这一渲染引擎是开源引擎WebKit中WebCore组件的一个分支[2],并且在Chrome(28及往后版本)、Opera(15及往后版本)和Yandex浏览器中使用[3] 。 

JavaScript引擎:

        说完了排版引擎,接下来说说 JavaScript 引擎。顾名思义,JavaScript引擎就是用来执行JS代码的。譬如说,一个算圆周率的网页,排版引擎把页面的框架给显示出来了,但最终的结果需要用到 Javascript 来计算,所以Javascript引擎的快慢也是对整个网页的速度有着很大影响,特别是目前越来越多类似 WebQQ、Gmail 等大量应用了复杂的 Javascript 运算的网站,不同的引擎最终的速度差异会相当大。 

        第一款JavaScript引擎由布兰登·艾克在网景公司开发,用于Netscape Navigator网页浏览器中。引擎的名字叫做SpiderMonkey,由C实现。它自JavaScript 1.5升级以符合ECMA-262 版本3。Rhino引擎,由网景公司的Norris Boyd开发,由Java实现。像SpiderMonkey一样,Rhino符合ECMA-262 版本3。JavaScript引擎的应用例子还包括: Apple Safari 4的Nitro,Google Chrome的V8和 Mozilla Firefox 3.5的TraceMonkey。

 

主要的网页浏览器JavaScript引擎:

Mozilla

SpiderMonkey,第一款JavaScript引擎,由Brendan Eich在Netscape Communications时编写,用于Mozilla Firefox 1.0~3.0版本。

Rhino,由Mozilla基金会管理,开放源代码,完全以Java编写。

TraceMonkey,基于实时编译的引擎,其中部份代码取自Tamarin引擎,用于Mozilla Firefox 3.5~3.6版本。

JaegerMonkey,德文Jäger原意为猎人,结合追踪和组合码技术大幅提高性能,部分技术借凿了V8、JavaScriptCore、WebKit,用于Mozilla Firefox 4.0以上版本。

IonMonkey,可以对JavaScript编译后的结果进行优化,用于Mozilla Firefox 18.0以上版本。

OdinMonkey,可以对asm.js进行优化,用于Mozilla Firefox 22.0以上版本。

Google

V8,开放源代码,由Google丹麦开发,是Google Chrome的一部分。

微软

Chakra (JScript引擎),中文译名为查克拉,用于Internet Explorer 9的32位版本[1]及Internet Explorer 10。

Opera

Linear A,用于Opera 4.0~6.1版本。

Linear B,用于Opera 7.0~9.2版本。

Futhark,用于Opera 9.5~10.2版本。

Carakan,由Opera软件公司编写,自Opera10.50版本开始使用。

其它

KJS,KDE的ECMAScript/JavaScript引擎,最初由Harri Porten开发,用于KDE项目的Konqueror网页浏览器中。

Narcissus,开放源代码,由Brendan Eich编写(他也参与编写了第一个SpiderMonkey)。

Tamarin,由Adobe Labs编写,Flash Player 9所使用的引擎。

Nitro(原名SquirrelFish),为Safari 4编写。

 

相关文章
|
2月前
|
Web App开发 JavaScript 前端开发
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
|
11天前
|
JSON 移动开发 JavaScript
在浏览器执行js脚本的两种方式
【10月更文挑战第20天】本文介绍了在浏览器中执行HTTP请求的两种方式:`fetch`和`XMLHttpRequest`。`fetch`支持GET和POST请求,返回Promise对象,可以方便地处理异步操作。`XMLHttpRequest`则通过回调函数处理请求结果,适用于需要兼容旧浏览器的场景。文中还提供了具体的代码示例。
在浏览器执行js脚本的两种方式
|
9天前
|
机器学习/深度学习 自然语言处理 前端开发
前端神经网络入门:Brain.js - 详细介绍和对比不同的实现 - CNN、RNN、DNN、FFNN -无需准备环境打开浏览器即可测试运行-支持WebGPU加速
本文介绍了如何使用 JavaScript 神经网络库 **Brain.js** 实现不同类型的神经网络,包括前馈神经网络(FFNN)、深度神经网络(DNN)和循环神经网络(RNN)。通过简单的示例和代码,帮助前端开发者快速入门并理解神经网络的基本概念。文章还对比了各类神经网络的特点和适用场景,并简要介绍了卷积神经网络(CNN)的替代方案。
|
15天前
|
Web App开发 JavaScript 前端开发
使用 Chrome 浏览器的内存分析工具来检测 JavaScript 中的内存泄漏
【10月更文挑战第25天】利用 Chrome 浏览器的内存分析工具,可以较为准确地检测 JavaScript 中的内存泄漏问题,并帮助我们找出潜在的泄漏点,以便采取相应的解决措施。
112 9
|
1月前
|
机器学习/深度学习 自然语言处理 前端开发
前端大模型入门:Transformer.js 和 Xenova-引领浏览器端的机器学习变革
除了调用API接口使用Transformer技术,你是否想过在浏览器中运行大模型?Xenova团队推出的Transformer.js,基于JavaScript,让开发者能在浏览器中本地加载和执行预训练模型,无需依赖服务器。该库利用WebAssembly和WebGPU技术,大幅提升性能,尤其适合隐私保护、离线应用和低延迟交互场景。无论是NLP任务还是实时文本生成,Transformer.js都提供了强大支持,成为构建浏览器AI应用的核心工具。
401 1
|
1月前
|
Web App开发 JavaScript 前端开发
JavaScript Window - 浏览器对象模型
JavaScript Window - 浏览器对象模型
21 2
|
28天前
|
JavaScript API
深入解析JS中的visibilitychange事件:监听浏览器标签间切换的利器
深入解析JS中的visibilitychange事件:监听浏览器标签间切换的利器
84 0
|
2月前
|
JavaScript 前端开发
js之浏览器对象|28
js之浏览器对象|28
|
1月前
|
JavaScript 前端开发 Java
JS引擎V8
【10月更文挑战第9天】
24 0
|
1月前
|
JavaScript 前端开发 开发者
JavaScript 浏览器控制台的使用
JavaScript 浏览器控制台的使用
17 0