首页 文章详情

Web 浏览器相关的一些概念

前端精髓 | 759 2021-01-20 20:33 0 0 0
UniSMS (合一短信)


这篇文章没有多少深刻内容,它主要涉及两个问题:


WebKit, Safari, Blink, Chromium, Chrome 之间是什么关系?


WebKit, Chromium, Android WebView, UIWebView/WKWebView 之间是什么关系?


不讨论从浏览器输入 URL 到页面展现期间发生了什么,不讨论浏览器是如何运行的,不讨论浏览器的架构。

浏览器

更准确的说是 Web 浏览器,即 Web Browser,用于访问万维网(World Wide Web)的计算机软件,支持 HTTP 协议,支持 HTML/CSS/JavaScript 等 Web 技术。


1、浏览器引擎(Browser Engine)

2、浏览器内核(Browser Kernel)

3、排版引擎(Layout Engine)

4、渲染引擎(Rendering Engine)

5、JavaScript 引擎(JavaScript Engine)


这几个名词经常会混用,通常只是广义和狭义的区别,浏览器内核/浏览器引擎/排版引擎/渲染引擎之间可以互换, 广义上的渲染引擎包含JS引擎,狭义上渲染引擎和JS引擎是两个不同的引擎。


一般提到浏览器内核时,主要指浏览器引擎,提到浏览器引擎时,主要指排版引擎/渲染引擎。


例如,在 Chromium 的文档中将 WebKit 描述为 Rendering Engine;WebKit 的文档中自述为 Web Browser Engine/Web Content Engine,它包含 WebCore 和 JavaScriptCore 等组件;描述 WebCore 时,称其是 WebKit 的 Layout Engine/Rendering Engine;描述 JavaScriptCore 时,称其是 WebKit 的 JavaScript Engine。

浏览器和浏览器引擎

浏览器引擎负责解析、渲染 HTML, CSS, JavaScript 和 DOM,但不包括菜单、工具栏等 UI 组件,也不包含系统服务、网络通信、打印、文件下载、PDF等功能。


例如,WebKit/Gecko 只是浏览器引擎(Web Browser Engine),不是浏览器;Chromium 是浏览器(Web Browser)。


1、基于 WebKit 的应用: Safari, Mail, App Store

2、基于 Gecko 的应用: Firefox, Thunderbird, SeaMonkey

3、基于 Chromium 的应用: Chrome, Opera, Microsoft Edge (Chromium), Electron


可以简单认为:

1、Chromium = Blink + V8 + 其他组件、库、服务

2、Safari = WebKit + 其他组件、库、服务

3、Chrome = Chromium + Google 服务集成

4、Microsoft Edge (Chromium) = Chromium + Microsoft 服务集成

5、Yandex Browser = Chromium + Yandex 服务集成

6、360 安全浏览器 = Trident + Chromium + 360 服务集成


常见浏览器版本

1、Chrome Stable/Beta/Dev/Canary

2、Microsoft Edge Stable/Beta/Dev/Canary

3、Safari Stable/Safari Technology Preview/WebKit Nightly

4、Firefox Stable/Beta/Developer Edition/Nightly


国内的浏览器大多数基于 Chromium,双核浏览器基于 Trident 和 Chromium。UC 浏览器和腾讯的 X5 内核也都基于 Chromium。


chromium 的含义为24号元素“铬(gè)”,chrome 的含义为“铬合金”,正好对应 Google Chrome 和 Chromium 间的关系。


Chromium 项目包括 Chromium 和 Chromium OS,对应 Google Chrome 和 Google Chrome OS。

渲染引擎和JS引擎


常见浏览器的渲染引擎和JS引擎:

BrowserRendering EngineJavaScript Engine
Internet Explorer (IE)Trident (MSHTML)JScript/Chakra
Microsoft EdgeEdgeHTMLChakra
FirefoxGeckoSpiderMonkey
SafariWebKitJavaScriptCore
ChromeBlinkV8
OperaPrestoCarakan


常见浏览器内置引擎的演进过程:

1、Raptor -> NGLayout -> Gecko

2、Mocha -> SpiderMonkey

3、Trident -> EdgeHTML

4、JScript -> Chakra (JScript9) -> Chakra

5、KHTML -> WebKit WebCore

6、KJS -> WebKit JavaScriptCore -> SquirrelFish -> SquirrelFish Extreme (SFE)

7、Linear A -> Linear B -> Futhark -> Carakan


关于浏览器引擎名称和版本的一些边角料:


IE 系列中,Internet Explorer 8 是第一个在 User Agent 字符串中包含 Trident 排版引擎的版本。


IE 最后一版为 IE11,Microsoft Edge 中的 EdgeHTML 延续了它的版本号 12-18。


WebKit 的 WebCore 和 JavaScriptCore 分别 fork 自 KDE 的 KHTML 和 KJS。


SquirrelFish 和 SquirrelFish Extreme 也被称为 Nitro 和 Nitro Extreme,它们都只是代号,项目始终叫 JavaScriptCore。


SpiderMonkey 存在一些历史上的优化版本,代号为 TraceMonkey, JägerMonkey, IonMonkey。


Goanna fork 自 Gecko,Goanna 是 Pale Moon, Basilisk 浏览器的排版引擎。


2010年4月,Apple 启动 WebKit2 项目,为 WebKit 实现了一个新的 API 层,后来原 WebKit 被重命名为 WebKitLegacy,WebKit2 被重命名为 WebKit。


2012年,Mozilla 启动 Servo 项目,希望开发一个高性能的、并行的浏览器引擎,用于替代 Gecko。


2013年4月,Google 创建 Blink,它 fork 自 WebKit WebCore,实现了沙箱和多进程模型。


2013年7月,Opera 发布基于 Chromium 开发的 Opera 15。


2018年12月,Microsoft 宣布新版 Microsoft Edge 将基于 Chromium 开发。渲染引擎


负责解析 HTML, CSS, JavaScript,渲染页面。


部分浏览器和它们使用的渲染引擎:

NCSA Mosaic

Netscape Navigator/Netscape: Gecko

Microsoft Internet Explorer: Trident

Lynx

Konqueror: KHTML

Opera: Presto -> Blink

Apple Safari: KHTML -> WebKit

Mozilla Firefox: Gecko

Google Chrome: WebKit -> Blink

Microsoft Edge: EdgeHTML

Microsoft Edge (Chromium): Blink


JavaScript 引擎

负责解释、执行 JavaScript 代码。


常见的JS引擎:


SpiderMonkey: Mozilla 的 JavaScript 引擎,使用 C/C++ 编写


Rhino: Mozilla 的开源 JavaScript 引擎,使用 Java 编写


Nashorn: Oracle Java Development Kit (JDK) 8 开始内置的 JavaScript 引擎,使用 Java 编写


JavaScriptCore: WebKit 内置的 JavaScript 引擎


ChakraCore: Microsoft 的开源 JavaScript 引擎


V8: Google 的开源 JavaScript 引擎,使用 C++ 编写


JerryScript: Samsung 开源的 JavaScript 引擎,被 IoT.js 使用


Hermes: Facebook 的开源 JavaScript 引擎,为 React Native 优化


QuickJS: 由 FFmpeg 作者 Fabrice Bellard 开发


WebView

WebView 允许开发者在自己的应用中渲染显示网页内容。


移动端 WebView 主要分 Android 和 iOS 两个阵营:


Android

Android WebKit WebView: 基于 WebKit

Chromium WebView: 基于 Chromium


iOS

UIWebView: 基于 WebKit

WKWebView: 基于 WebKit


简单说明:


从2013年发布的 Android 4.4 Kitkat 开始,增加 Chromium WebView,用来取代 Android WebKit WebView。(开始支持远程调试)


从2014年发布的 Android 5.0 Lollipop 开始,Chromium WebView 支持以 Android System WebView App 的形式在应用商店中下载,独立升级。这就是为什么在 Can I use 上 Android Browser 一栏 Android 4.4.4 和 5.0 是个分水岭的原因,理论上,从 Android 5.0 Lollipop 开始,Chromium WebView 会一直更新升级。


Android 可以在 App 中集成其他 WebView 组件,如 TBS X5 内核的 WebView,或者集成其他 JavaScript 引擎,如为 React Native 专门优化的 Hermes。iOS 上只能使用系统内置的 WebView。


从2014年发布的 iOS 8 和 OS X 10.10 开始,增加 WKWebView,用来取代 iOS 上的 UIWebView 和 macOS 上的 WebView 组件。

good-icon 0
favorite-icon 0
收藏
回复数量: 0
    暂无评论~~
    Ctrl+Enter