delphi 调用浏览器内核_深入理解浏览器原理

导语：本文从市面主流的浏览器及相应的内核引擎开始，介绍了Chromium为代表的浏览器架构及Blink内核的功能架构。Chromium为多进程架构，用户从启动运行浏览器后，先后经过页面导航、渲染、资源加载、样式计算、布局、绘制、合成到栅格化，最后完成GPU展 示。而页面渲染完成后，浏览器如何响应页面操作事件也进行了深入的介绍。良心推荐！ 本文第二至五部分内容根据 Mariko Kosaka 的英文原版《Inside look at modern web browser》(见参考文献)，进行翻译、理解、总结提炼、条理化、加入应用示例、进行相关知识补充扩展而来。

一、浏览器概论 浏览器经历了很多年的发展，浏览器引擎也在不停地迭代和演进。从PC时代到移动端，以独立浏览器的形态还是以系统WebView组件内嵌的形态存在，在互联网的生态系统中一直扮演着重要的角色。了解浏览器及其原理可以让我们打开另一个世界。

1. 浏览器引擎

以下是市面留存的主流浏览器的引擎介绍。 1.1 浏览器引擎

• Trident：IE浏览器引擎
• Gecko：Firefox浏览器引擎
• Presto：Opera浏览器引擎
• Webkit：Safari，Google Chrome浏览器引擎。

1) Chromium：基于webkit，08年开始作为Chrome的引擎，Chromium浏览器是Chrome的实验版，实验新特性。 2) Webkit2：2010年随OS X Lion一起面世。WebCore层面实现进程隔离与Google的沙箱设计存在冲突。 3) Blink：基于Webkit2分支，13年谷歌开始作为Chrome 28的引擎集成在Chromium浏览器里。Android的WebView同样基于Webkit2。 1.2 微软浏览器 目前PC场景操作系统仍是windows一统天下，对桌面用户来说，虽然IE的市场份额在下降，但是IE曾经也风光过。IE内核以Trident为主，最新的Edge也兼容了Chromium内核。 Microsoft Edge：内核为：EDGE，Windows 10默认浏览器，不能单独下载安装。兼容Chromium内核，同时保留EDGE内核来兼容企业网站

• Internet Explorer 11：Windows 8.1，引擎Trident 7.0

• Internet Explorer 10：Windows 8默认浏览器，引擎Trident

• Internet Explorer 9

• Internet Explorer 8：Windows 7集成

• Internet Explorer 7：Windows Vista集成，2016年停止支持

• Internet Explorer 6：2014年停止支持

2. 浏览器架构

目前chromium浏览器的架构主要由下以几个部分构成。 以下为架构的介绍：

• 操作系统：WebKit可以运行在不同的操作系统上，如Chromium浏览器支持Windows、Linux、Android等系统；

• 第三方库：这些库是WebKit运行的基础，包括2D图形库、3D图形库、网络库、存储库、音视频库等；

• WebCore：WebKit加载和渲染网页的基础，是不同浏览器所使用的WebKit中共享的部分，包括HTML解析器、CSS解析器、SVG、布局、渲染树等等；

• JavaScript引擎：JavaScript解析器，WebKit默认的引擎是JavaScriptCore，Google的Blink为V8引擎；

• WebKit Ports：WebKit中的移植部分，包括网络栈、音视频解码、硬件加速等模块，这部分对WebKit的功能和性能影响比较大。

• WebKit嵌入式接口：WebKit对外暴露的接口层，这个接口是提供给浏览器调用的，如给chromium调用，因为接口与具体的移植也有关系，所以中间会有一个WebKit绑定层

JavaScriptCore(用于Safari)

• JavaSript Parser，JSON Parser
• 字节编译器：使用内部字节码格式
• 汇编程序：在运行时使用代码修补 - >它需要可写代码内存
• 数据流图：基于编译时推测优化生成代码的新举措
• 解释器：运行生成的字节码
• Regexp引擎：支持JIT
• 垃圾收集器：标记和扫描
• 运行时：所有JS全局对象(日期，字符串，数字等)
• 调试器，Profiler

---

WebCore

• 资源加载器：HTML和XML解析器，DOM
• SVG和SMIL
• CSS：分析器，选择器，动画
• 渲染和布局
• 绑定生成器：IDL文件：JSC，V8，ObjC
• HTML5：音频，视频，画布，WebGL，通知功能
• WebInspector
• 平台集成：图形，字体，声音，视频

---

相关资料

• Blink内核：https://src.chromium.org/vi