客户端容器 1 | 青训营笔记

94 阅读2分钟

浏览器架构

浏览器架构演进

  • 单进程架构:所有的模块运行在一个进程里,包括网络,插件,JavaScript运行环境
  • 多进程架构:主进程,网络进程,渲染进程,GPU进程,差劲进程
  • 面向服务架构:将原来的UI,数据库,文件,设备,网络等,作为一个独立的基础服务

image-20230427220049277.png

  • 浏览器架构的对比 image-20230427220327227.png

  • 多进程分工

image-20230427220533649.png

早期因为内存等硬件的限制,为节省昂贵的内存资源,出现了单线程架构。

面向服务架构是Google在2016年在多进程架构的基础上进行演进的,在配置较好的设备上会使用面向服务架构,在配置一般的设备上采用多进程架构

渲染进程

  • 浏览器内核 image-20230427221351783.png

多线程架构

渲染进程内部是多线程实现,主要负责页面渲染,脚本执行,事件处理,网络请求等

image-20230427222739503.png

image-20230427222804392.png

js引擎与渲染引擎

  • 解析执行js
  • XML解析生成渲染树,显示在屏幕
  • 桥接方式通信

image-20230427223026561.png

在V8引擎中,会对高频率使用的函数进行优化,把字节码通过JIT编译成机器码直接执行,再次遇到相同的函数则不用在进行编译。

即时编译(Just-in-time compilation,JIT;又译及时编译、实时编译)是一种执行计算机代码的方法,这种方法设计在程序执行过程中(在执行期)而不是在执行之前进行编译。通常,这包括源代码或更常见的字节码到机器码的转换,然后直接执行。实现JIT编译器的系统通常会不断地分析正在执行的代码,并确定代码的某些部分,在这些部分中,编译或重新编译所获得的加速将超过编译该代码的开销。

JIT编译是两种传统的机器代码翻译方法——提前编译(AOT)和解释器——的结合,它结合了两者的优点和缺点。

多线程工作流程

  1. 网络线程负责加载网络资源
  2. JS引擎解析JS脚本并且执行
  3. JS解析引擎空闲时,渲染线程立即工作
  4. 用户交互,定时器操作等产生回调函数放入任务队列中
  5. 事件线程进行事件循环,将队列中的任务取出来交给JS引擎执行

image-20230427224721432.png

Chrome运行原理

。。。。