浏览器的多进程架构

12 阅读24分钟

浏览器内核

  1. Trident (IE 内核):由微软开发,代表浏览器为Internet Explorer。该内核仅支持 Windows 系统,兼容性较好但标准支持较差,IE 浏览器已停止更新 。‌
  2. Gecko (Firefox 内核):由 Mozilla 基金会开发,代表浏览器为Mozilla Firefox‌。特点是开源、跨平台(Windows、macOS、Linux),标准支持优秀 。‌‌‌
  3. WebKit (Safari 内核):由苹果公司主导开发,代表浏览器为 Safari。渲染速度快,移动端表现优秀,是 Chrome 早期使用的内核 。‌
  4. Blink (Chrome 内核):由 Google 主导开发,是 WebKit 的分支。代表浏览器为Google Chrome、新版 Microsoft Edge、Opera

JavaScript 引擎

V8 引擎‌(由 Google 开发,用于 Chrome 浏览器和 Node.js)。

JavaScriptCore (JSC) ‌:由 Apple 开发,是 WebKit 浏览器引擎的一部分,主要用于 ‌Safari 浏览器‌。在 iOS 上,由于系统限制,所有浏览器必须使用 WebKit,因此 JSC 是 iOS 上事实上的标准 JS 引擎。

SpiderMonkey‌:由 Mozilla 开发,是‌世界上第一个 JavaScript 引擎‌,由 Brendan Eich(JavaScript 之父)最初实现,目前用于 ‌Firefox 浏览器

QuickJS‌:一个轻量级、高性能的 JS 引擎,支持 ES2020/ES2021 大部分特性,‌无外部依赖‌,适合嵌入式系统或需要小体积的应用场景。

Hermes‌:由 Facebook(现 Meta)开发,专为 ‌React Native‌ 优化,尤其在 Android 平台上显著提升启动速度和内存效率。

Rhino‌:由 Mozilla 基金会维护,‌完全用 Java 实现‌,常用于 Java 应用中嵌入 JavaScript 执行环境。

浏览器的进程

Chrome 的多进程架构是其核心设计之一,旨在提升‌稳定性、安全性与性能

  • 浏览器主进程 Browser Process
  • 渲染进程 Renderer Process
  • 网络进程 Network Process
  • GPU进程 GPU Process
  • 插件和拓展进程 Plugin / Extension Process
  • 沙箱进程 Sandbox Process
  • 音频进程 Audio Process
  • 存储进程 Storage Process
  • 实用程序进程 Utility Process
  • 崩溃报告进程 Crash Reporter Process
  • 服务工作者进程 Service Worker Process

浏览器主进程 (Browser Process)

负责管理用户界面、协调各子进程、处理系统级任务,并保障浏览器的整体稳定与安全。

  • 界面与用户交互管理
    主进程掌控地址栏、书签、前进/后退按钮、标签页管理等UI组件,确保用户操作流畅响应。
  • 子进程调度与通信中枢
    它负责创建和销毁渲染进程、GPU进程、网络进程等,并通过‌进程间通信(IPC)机制‌实现各进程之间的数据交换与协同工作。
  • 安全策略执行与权限控制
    所有涉及文件访问、网络请求、摄像头/麦克风调用等敏感操作,都需经主进程审核授权,防止恶意网页越权行为。
  • 资源协调与稳定性保障
    当某个标签页崩溃时,主进程可独立重启该渲染进程而不影响其他页面,极大提升了浏览器的容错能力。
  • 多进程架构的基石
    作为唯一存在的浏览器主进程,它是整个多进程体系的起点和核心,所有其他进程均由其派生并受其监管。

主进程的核心线程

  1. UI 线程(UI Thread)

    • 职责‌:负责处理用户界面(UI)相关的操作,如地址栏、书签栏、标签页管理、菜单显示等。
    • 特点‌:与浏览器的图形界面直接相关,是主线程的一部分,负责响应用户输入并更新界面。
  2. IO 线程(IO Thread)

    • 职责‌:处理文件系统、网络请求等 I/O 操作,例如下载文件、读写缓存、访问本地存储等。
    • 特点‌:避免阻塞主线程,提升浏览器响应速度和稳定性。
  3. 网络请求线程(Network Request Thread)

    • 职责‌:负责发起和管理 HTTP/HTTPS 请求、WebSocket 连接等网络通信任务。
    • 特点‌:通常由独立的网络进程(Network Process)承担,但主进程会调度和协调这些请求。
  4. 存储线程(Storage Thread)

    • 职责‌:管理浏览器本地数据存储,如 IndexedDB、Cookie、缓存(Cache Storage)等。
    • 特点‌:确保数据安全、高效地读写,防止跨站攻击或恶意脚本访问敏感信息。
  5. 插件管理线程(Plugin Management Thread)

    • 职责‌:负责加载和管理浏览器插件(如 Flash、PDF 阅读器等),包括插件的启动、停止和生命周期控制。
    • 特点‌:每个插件运行在独立进程中,主进程通过 IPC 与插件进程通信。
  6. 安全与权限控制线程(Security & Permissions Thread)

    • 职责‌:执行安全策略,如检查网站权限(摄像头、麦克风、地理位置)、拦截恶意内容(SafeBrowsing)、验证证书等。
    • 特点‌:保障用户隐私和系统安全,防止非法访问和恶意行为。
  7. 进程间通信(IPC)线程

    • 职责‌:负责主进程与其他子进程(如渲染进程、GPU 进程、网络进程)之间的通信。
    • 特点‌:通过 IPC 机制传递消息、数据和指令,确保各进程协同工作。
  8. 定时器线程(Timer Thread)

    • 职责‌:处理定时任务,如 setTimeout 和 setInterval 的执行调度,管理浏览器层面的系统级定时任务,如页面加载超时检测、浏览器功能定时任务等。。
    • 特点‌:虽然 JavaScript 引擎本身是单线程的,但定时器由浏览器底层线程负责,确保精确计时。
  9. 崩溃报告线程(Crash Reporting Thread)

    • 职责‌:监控浏览器及各子进程的运行状态,当发生异常或崩溃时,收集日志信息并上传至服务器。
    • 特点‌:帮助开发者定位问题,持续优化浏览器稳定性。

渲染进程

Chrome浏览器的渲染进程(Renderer Process)是负责处理网页内容显示和交互的核心组件。每个标签页通常运行在独立的渲染进程中,确保了浏览器的稳定性和安全性。

  1. 网页内容解析与渲染‌:

    • 解析HTML、CSS和JavaScript代码。
    • 构建DOM树(文档对象模型)和CSSOM树(CSS对象模型)。
    • 根据DOM树和CSSOM树生成渲染树,并进行布局计算,确定元素的几何位置和样式。
    • 将渲染树转换为可视化的图像,通过合成和栅格化过程最终显示在屏幕上。
  2. 执行JavaScript代码‌:

    • 渲染进程中的主线程负责执行JavaScript脚本,处理用户交互事件。
    • 支持Web Workers和Service Workers等异步任务,提升页面性能。
  3. 处理用户交互‌:

    • 响应用户的点击、滚动、键盘输入等操作。
    • 管理页面的动态内容更新和事件处理。
  4. 资源加载与管理‌:

    • 加载网页所需的外部资源,如图片、样式表、脚本文件等。
    • 通过预加载扫描器优化资源加载顺序。
  5. 性能优化与安全隔离‌:

    • 利用多线程机制(如主线程、合成器线程、光栅线程等)提高渲染效率。
    • 在沙盒环境中运行,防止恶意代码对系统造成损害。

核心线程

现代浏览器为了提高性能和简化架构,将原本分离的线程功能进行了整合,合成线程(Compositor Thread) ‌和‌光栅化线程(Raster Thread) ‌被引入,用于处理更复杂的渲染任务,而主线程则专注于JavaScript执行和基础渲染逻辑。GUI渲染功能被整合到了主线程中

  1. 主线程(Main Thread)

    • 职责‌:负责解析HTML、CSS,执行JavaScript代码,处理DOM操作和事件循环。这是渲染进程中最重要的线程,处理大部分页面逻辑。
    • 特点‌:与GUI渲染线程互斥,JavaScript执行期间会阻塞界面更新。
  2. 合成线程(Compositor Thread)

    • 职责‌:负责页面的合成操作,包括处理滚动、动画和图层管理。它将多个图层组合成最终的屏幕图像。
    • 特点‌:与主线程分离,能够实现更流畅的滚动和动画效果。
  3. 光栅化线程(Raster Thread)

    • 职责‌:将合成线程生成的图层转换为实际的像素数据,准备显示在屏幕上。
    • 特点‌:通常由多个线程并行处理,提高渲染效率。
  4. JavaScript引擎线程(JS Engine Thread)

    • 职责‌:执行JavaScript代码,由V8引擎提供支持。该线程与主线程通常为同一线程。
    • 特点‌:JavaScript是单线程的,所有任务在该线程上排队执行。
  5. 网络请求线程(Network Request Thread)

    • 职责‌:处理页面中的网络请求,如加载图片、CSS、JavaScript文件等。
    • 特点‌:与主线程分离,避免阻塞页面渲染。
  6. 定时器线程(Timer Thread)

    • 职责‌:处理setTimeoutsetInterval等定时任务,专门管理页面内 JavaScript 的定时器任务,如 setTimeout 和 setInterval 的回调执行。
    • 特点‌:由浏览器底层线程负责,确保定时器的精确执行。
    • 渲染进程中的定时器线程和浏览器主进程的定时器线程在功能上都涉及定时任务的管理,但它们在职责范围、管理对象和实现机制上存在明显差异。
  7. 事件处理线程(Event Thread)

    • 职责‌:处理用户交互事件,如点击、键盘输入等。
    • 特点‌:事件触发线程负责将事件添加到事件队列中,等待主线程处理。
  8. Web Worker线程

    • 职责‌:运行在独立线程中的后台脚本,用于执行耗时任务而不阻塞主线程。
    • 特点‌:与主线程隔离,可以并行处理任务。

网络进程

  1. ‌网络连接管理

网络进程负责管理各种网络连接,包括TCP/IP连接、UDP连接等。它处理网络接口的配置和管理,确保应用程序能够通过网络进行通信。这包括处理网络套接字(socket)的创建、维护和关闭等操作。

  1. ‌数据传输处理

网络进程负责处理网络请求和响应,包括发送和接收数据包。在浏览器环境中,它负责加载网页资源(如图片、脚本、样式表等),并管理这些资源的下载和缓存。它处理HTTP、HTTPS等协议请求,确保数据能够准确无误地在网络中传输。

  1. ‌并发请求处理

网络进程能够高效地处理多个并发网络请求。在浏览器中,当用户打开多个标签页时,网络进程可以并行处理不同页面的资源加载请求,提高整体性能。

  1. ‌资源隔离与稳定性

在多进程架构中,网络进程通常与渲染进程、浏览器进程等分离运行。这种设计确保了即使某个进程出现故障,也不会影响到整个系统的网络功能。例如,在浏览器中,网络进程的独立运行使得一个标签页的网络问题不会影响到其他标签页的正常运行。

  1. ‌安全与协议支持

网络进程还负责处理网络安全相关任务,如SSL/TLS加密解密、防火墙规则应用等。它支持多种网络协议,确保网络通信的安全性和可靠性。

  1. ‌性能优化

通过将网络任务从主线程中分离出来,网络进程可以更高效地处理并发请求,提升整体性能。它还可能包含缓存机制,减少重复网络请求,优化资源加载速度。

  1. ‌系统级网络服务

在网络进程的管理下,系统可以提供各种网络服务,如DNS解析、网络状态监控、网络故障恢复等。这些服务对于维持网络连接的稳定性和可靠性至关重要。

GPU进程

独立处理所有图形加速任务(如 3D CSS、WebGL、页面合成) 避免 GPU 任务阻塞主线程,提升渲染流畅度

  1. 加速网页渲染

GPU 进程可以将部分渲染任务从 CPU 转移到 GPU 上执行,尤其是涉及 3D 变换、动画、视频播放、Canvas 和 WebGL 等图形密集型操作时。这种硬件加速能显著提高渲染效率,减少页面卡顿。

  • 例如,使用 transform: translate3d() 或 opacity 属性触发硬件加速,可以让动画在 GPU 中流畅运行,而不会阻塞主线程。
  • Chrome 浏览器利用 GPU 进程来处理复合图层(Composited Layers)的渲染,将不同图层独立绘制,从而减少不必要的重排和重绘。
  1. 支持 3D CSS 和 WebGL

GPU 进程使得浏览器能够高效地实现 3D CSS 效果和 WebGL 图形编程,为网页提供更丰富的视觉体验。

  • 通过 WebGL,开发者可以在浏览器中直接调用 GPU 进行复杂的图像处理、滤镜效果或 3D 渲染。
  • 在 Chromium 架构中,GPU 进程负责处理来自渲染进程的 OpenGL/OpenGLES 命令,并将其转换为实际的图形操作。
  1. 提升性能与响应性

通过将图形计算任务交给 GPU,可以释放 CPU 资源用于处理 JavaScript、网络请求等其他任务,使浏览器整体运行更加流畅。

  • GPU 进程还支持图像合成(Compositor Thread),允许 CSS 动画在不依赖主线程的情况下运行,即使主线程被 JavaScript 阻塞,动画也能保持流畅。
  1. 多进程架构中的角色

在现代浏览器(如 Chrome)的多进程架构中,GPU 进程是一个独立的进程,用于隔离渲染任务与主线程,增强系统稳定性和安全性。

  • 渲染进程通过 IPC(进程间通信)将图形指令发送到 GPU 进程,避免了渲染进程直接访问 GPU,提高了安全性。
  • GPU 进程通常只在启用 GPU 加速时才会创建。
  1. ‌资源管理与调度

GPU 进程还负责管理 GPU 的资源使用,例如内存、缓冲区和命令队列,确保多个页面或标签页之间的图形任务可以高效调度。

插件进程

负责每个第三方插件的使用,每个第三方插件使用时候都会创建一个对应的进程、这可以避免第三方插件crash影响整个浏览器、也方便使用沙盒模型隔离插件进程,提高浏览器稳定性。

  1. 早期设计:一个插件类型一个进程

在Chrome等浏览器的早期多进程架构中,‌相同类型的插件会共享同一个插件进程‌。例如:

  • 所有Flash插件实例运行在同一个插件进程中;
  • 所有PDF阅读插件(如Chrome内置的PDFium)也共用一个进程。

这样做是为了平衡资源消耗与隔离性:既避免每个插件都开独立进程带来的内存开销,又能将不稳定的插件与主程序隔离。


  1. 进程隔离策略由浏览器动态管理

浏览器会根据以下因素决定插件的进程分配:

  • 插件类型‌:不同类型的插件(如Flash vs. Java)运行在不同的进程中,互不影响。
  • 站点来源(Site Isolation) ‌:某些高安全需求场景下,浏览器可能为不同网站的插件分配独立进程,防止跨站攻击。
  • 资源负载与策略‌:浏览器会综合内存、性能和安全策略,动态调整进程模型,可能合并或拆分进程。

  1. 现代趋势:插件逐渐被沙箱化API取代

随着HTML5、WebAssembly等技术的发展,传统插件(如Flash、Silverlight)已被淘汰。现代“扩展”(Extensions)更多以‌Service Worker、内容脚本‌等形式运行在受控环境中,不再依赖独立插件进程。

如Chrome扩展现在主要通过渲染进程或独立的扩展服务进程运行,而非传统意义上的“插件进程”。


  1. 进程外 vs. 进程内插件

从技术角度看,插件运行模式分为两类:

  • 进程内插件(In-Process) ‌:插件运行在宿主进程内部(如旧版IE),风险高,已基本弃用。
  • 进程外插件(Out-of-Process) ‌:插件运行在独立进程,崩溃不会导致浏览器整体崩溃,是现代浏览器的标准做法。

音频进程 (Audio Process)

独立处理音频解码与播放任务,确保音乐、视频等媒体内容在标签页切换或页面卡顿时仍能流畅输出,避免因主线程阻塞导致声音中断。

存储进程 (Storage Process)

负责管理本地数据存储操作,如 IndexedDB、Cache API 和文件系统访问,通过隔离敏感数据读写行为,增强隐私保护并优化性能响应。

实用程序进程 (Utility Process)

承担特定系统级任务,例如 PDF 文档渲染(pdfium)、网络服务(Network Service)以及 WebRTC 媒体处理等。这类进程按需启动,职责单一且可复用,有助于降低资源冗余。

崩溃报告进程 (Crash Reporter Process)

当任一进程异常终止时,该进程会自动捕获堆栈信息、内存快照和上下文日志,并安全上传至 Google 服务器,用于问题诊断与产品优化。

服务工作者进程 (Service Worker Process) ‌

虽未独立显示于任务管理器,但现代 Chrome 为 PWA(渐进式网页应用)中的 Service Worker 分配专用执行环境,支持离线缓存、消息推送等后台功能,提升用户体验。

渲染流程详解

  1. HTML解析‌:

    • 渲染进程的主线程开始解析HTML文档,生成DOM树。
    • 同时,预解析线程会提前加载外部资源(如CSS、JS)。
  2. CSS解析与样式计算‌:

    • 解析CSS文件,生成CSSOM树。
    • 样式计算阶段,将CSSOM树与DOM树合并,生成渲染树(Render Tree),并计算每个元素的样式。
  3. 布局计算(Layout) ‌:

    • 根据渲染树计算每个元素的几何信息(位置、大小等)。
  4. 分层(Layering) ‌:

    • 将渲染树划分为多个图层,便于优化渲染性能。
  5. 绘制(Paint) ‌:

    • 为每个图层生成绘制指令,描述如何绘制内容。
  6. 光栅化(Raster) ‌:

    • 合成线程将图层划分为图块,光栅化线程将图块转换为位图。
  7. 合成与显示(Composite & Draw) ‌:

    • 合成线程将所有图层的位图合并为一帧,提交给GPU进行最终显示。

渲染流程细节

DOM 概念

DOM是C++的概念,但是DOM对象是js的概念,DOM对象是一种特殊的js对象,js引擎给开发者提供了api,可以操作通过js中的DOM对象,来修改底层的DOM。我们熟悉的 document 归为接口。

Dom (documents object model)

1)所有的HTML元素以及文本注释形成一个对象就是Dom树

2)浏览器中的DOM树是由C++定义的对象

3)JS中的DOM操作是由JS定义的对象

f22f8509b56949e18cb3e1e2a3e55cee~tplv-k3u1fbpfcp-watermark (1).png

借网上一个截图说明一下,这个截图是红宝书上的一段解释。

回流重绘

回流(Reflow)

当页面的几何结构发生变化时,浏览器需要重新计算元素的尺寸、位置等布局信息,这个过程就是回流,也叫重排。

  • 改变元素的尺寸、位置相关的属性,比如widthheightmarginpaddingposition等;
  • 添加或删除可见的DOM元素;
  • 窗口大小调整、滚动页面;
  • 浏览器字体大小改变。

回流会触发整个页面或部分页面的重新布局,计算量大,会消耗较多CPU资源,频繁回流会导致页面卡顿、性能下降。

重绘(Repaint)

当元素的外观样式改变但不影响布局时,浏览器会重新绘制元素的外观,这个过程就是重绘。

  • 改变元素的背景色、边框颜色、文字颜色等不影响布局的样式;
  • 改变元素的visibility属性;
  • 动画效果中只改变元素的外观属性。

重绘只涉及元素的绘制操作,计算量相对回流小很多,但如果频繁触发,也会对页面性能有一定影响。

汇总解释

浏览器的回流、重绘主要在‌渲染线程(Rendering Thread) ‌中执行,同时会和主线程(UI线程)配合完成相关工作,具体流程如下:

  1. 触发阶段(主线程)
    当JavaScript代码修改DOM、CSS样式,或者窗口尺寸变化等触发回流/重绘的事件发生时,首先会在主线程中被捕捉和处理,主线程会将这些变更信息传递给渲染线程。

  2. 执行阶段(渲染线程)

    • 回流‌:渲染线程会重新计算所有受影响元素的尺寸、位置等布局信息,这个过程需要遍历DOM树和样式树,计算量较大。
    • 重绘‌:在回流完成(或单独触发重绘时),渲染线程会根据新的布局和样式信息,重新绘制元素的外观,将像素信息提交给合成线程。
  3. 合成与显示(合成线程)
    渲染线程完成绘制后,会将绘制好的图层信息传递给合成线程,合成线程会将多个图层进行合成,最终将合成后的画面提交给GPU,由GPU完成最终的屏幕显示。

重绘比回流快,核心在于两者涉及的计算范围和操作复杂度差异巨大,具体可以从以下几个维度理解:

  1. 操作范围不同

    • 回流:需要重新计算整个页面或受影响区域所有元素的尺寸、位置、层级等布局信息,要遍历DOM树和样式树,还要处理元素间的依赖关系,比如修改一个父元素的宽度,可能会影响所有子元素的布局,计算范围覆盖整个渲染流程的核心逻辑。
    • 重绘:仅针对元素的外观样式进行绘制,比如颜色、背景图、边框样式等,不需要重新计算布局,只在已有布局基础上更新视觉表现,操作范围局限在单个元素的绘制阶段。
  2. 计算复杂度不同

    • 回流:要执行复杂的几何计算,比如元素的盒模型计算、浮动定位、弹性布局等,还要考虑浏览器的布局算法,计算量大,对CPU资源消耗高。
    • 重绘:只是将新的样式属性应用到元素的绘制流程中,不需要复杂的布局计算,更多是调用图形绘制接口完成像素填充,计算量远小于回流。
  3. 触发的后续流程不同

    • 回流完成后,通常会触发重绘,同时可能还会引发合成线程的图层更新、GPU的渲染提交等后续操作,整个流程链路长。
    • 重绘可以直接在现有图层基础上更新,部分场景下还能利用GPU硬件加速,直接完成绘制提交,流程更短。

回流是“重新搭建骨架”,重绘是“刷新皮肤”,前者要处理的逻辑和计算量远多于后者,所以重绘的速度更快。

重绘和GPU加速

  1. 常规场景:渲染线程完成
    大部分基础的重绘操作,比如修改元素的背景色、文字颜色等简单样式,是由‌渲染线程‌在CPU上完成的。渲染线程会根据新的样式信息,重新绘制元素的像素内容,再将绘制好的图层信息传递给合成线程。
  2. 优化场景:GPU加速完成
    当使用了支持硬件加速的CSS属性时,比如transformopacityfilter等,或者元素被设置为独立图层(如will-change属性),重绘操作会被交给‌合成线程‌,由合成线程调用GPU来完成绘制。这种情况下,GPU会直接处理像素绘制任务,大幅提升重绘效率,还能避免触发主线程的回流和重绘。

简单来说,普通重绘在CPU的渲染线程中完成,而利用硬件加速的重绘则会在GPU中完成。

补充说明

  • 主线程和渲染线程是单线程且互斥的,如果主线程被长时间占用(比如执行复杂JS代码),会阻塞渲染线程的回流和重绘操作,导致页面卡顿。
  • 现代浏览器中,部分优化的绘制操作(比如使用transformopacity实现的动画)可以利用GPU加速,由合成线程直接在GPU中完成绘制,避免触发主线程的回流和重绘,提升页面性能。

线程协作机制

  • 事件循环机制‌:浏览器通过事件循环机制管理任务队列,确保任务按序执行。JavaScript引擎线程、GUI渲染线程、定时器线程、事件触发线程等线程通过消息队列进行通信。
  • 任务队列‌:包括宏任务队列和微任务队列,微任务优先级高于宏任务。
  • 线程互斥‌:GUI渲染线程与JavaScript引擎线程互斥,JavaScript执行时GUI渲染线程会被挂起。

性能优化

  • 避免JavaScript阻塞‌:长时间运行的JavaScript会阻塞页面渲染,应尽量减少阻塞操作。
  • 利用合成线程优化动画‌:使用transformopacity等属性进行动画,可由合成线程处理,避免重排和重绘。
  • 合理使用缓存‌:通过浏览器缓存机制减少网络请求,提升加载速度。

通过这种多进程、多线程的协作机制,现代浏览器能够高效、安全地处理复杂的网页渲染任务,确保用户获得流畅的浏览体验。

V8 引擎如何执行Javascript

V8 架构

架构组成

V8 是 Google 开发的高性能 JavaScript 引擎,广泛应用于 Chrome 浏览器和 Node.js 环境中。其架构设计以“快速启动 + 持续优化”为核心目标,主要包含以下几个关键组件:

  1. Parser(解析器)
  • 负责将 JavaScript 源代码进行‌词法分析‌和‌语法分析‌,生成‌抽象语法树(AST) ‌。
  • 采用‌惰性解析(Lazy Parsing) ‌策略:对未立即执行的函数仅做预解析,减少内存占用并提升启动速度。
  1. Ignition(解释器)
  • 将 AST 编译为轻量级的‌字节码(Bytecode) ‌,并逐行解释执行。
  • 字节码体积小、生成快,有助于提升脚本的启动性能。
  • 在执行过程中收集运行时信息(如变量类型、调用频率),为后续优化提供依据。
  1. TurboFan(优化编译器)
  • 对被频繁执行的“热点代码”进行‌即时编译(JIT, Just-In-Time) ‌,将其转换为高度优化的机器码。
  • 利用运行时类型信息进行深度优化,如‌内联函数调用‌、‌常量折叠‌、‌死代码消除‌等。
  • 当类型假设失效时,会触发‌去优化(Deoptimization) ‌机制,退回解释执行,保证正确性。
  1. Heap 与垃圾回收(GC)
  • 内存管理采用‌分代回收‌策略:新生代使用 Scavenge 算法快速回收,老生代使用 Mark-Compact 和 Mark-Sweep 算法。
  • 支持‌增量、并发与并行 GC‌,减少主线程停顿时间,提升应用响应性。
  1. API & Bindings(外部接口)
  • 提供 C++ 与 JavaScript 的互操作能力,使宿主环境(如 Blink 渲染引擎或 Node.js)可以调用 JS 函数,反之亦然。

术语解析

词法分析(Lexical Analysis)

  • 将源码转换为‌Token 流‌,识别关键字、标识符、字面量、运算符等。
  • 例如:var a = 1; 被分解为 vara=1; 等 Token。

语法分析(Syntax Analysis)

  • 将 Token 构建成‌抽象语法树(AST) ‌,反映代码结构和语义关系。
  • AST 是后续优化和执行的基础。

字节码生成(Bytecode Generation)

  • V8 将 AST 转换为‌字节码(Bytecode) ‌,用于快速执行。
  • 字节码是一种中间表示形式,执行速度比源码快,但不如机器码高效。

即时编译(JIT Compilation)

  • 对频繁执行的字节码进行‌优化编译‌,生成高效的机器码。
  • V8 使用两个编译器:
  • Ignition‌:解释执行字节码。
  • TurboFan‌:将热点代码优化为高性能机器码。

优化与执行

  • V8 会根据代码运行频率和模式,动态优化代码性能。
  • 例如,当某个函数被多次调用时,TurboFan 会对其进行优化,提升执行效率。