浏览器中最核心的部分是浏览器内核，每个浏览器都有各自的内核，而对移动领域影响最深的则当属WebKit
WebKit
WebKit是一个页面渲染以及逻辑处理引擎，HTML，JS，CSS经过它的处理，成为可见且可操作的Web页面
WebKit Embedding API：负责浏览器UI与WebKit进行交互的部分
Platform API（WebKit Ports）：让WebKit更加方便的移植到各个操作系统、平台上，提供一些调用Native Library的接口
例如在渲染层面，iOS系统中通过Safari的CoreGraphics处理，而Android系统则是通过Skia处理
WebCore：渲染引擎
JSCore：JS引擎
WebCore
首先浏览器通过URL定位到了一堆由HTML，CSS，JS组成的资源文件
通过Loader把资源文件给WebCore
HTML Parser把HTML解析成DOM树，CSS Parser把CSS解析成CSSOM树
合并两棵树，生成最终需要的Render Tree（渲染树）
再经过布局，与具体的WebKit Ports的渲染接口，把Render Tree在浏览器中渲染为Web页面
JSCore
解释执行
\[ JScode\overset{编译}{\rightarrow}ByteCode \]
\[ ByteCode\overset{LLInt}{\rightarrow}执行 \]
ByteCode的解释执行，通过与LLInt和JIT，在低延时和高吞吐之间采用有效的平衡方式：由低延时的LLInt来解释执行ByteCode，当遇到多次重复调用或者是递归，循环等条件，会通过OSR切换成JIT进行解释执行来加快速度
OSR
堆栈替换（on-stack replacement），简称OSR，一种运行时替换栈帧的技术。使用OSR最常见的目的就是在一个函数的执行过程中，在执行引擎的不同优化层级之间切换，可以是从低优化层级向高优化层级切换，也可以反过来
- 从低优化向高优化迁移：为了平衡启动性能（启动速度快，所以要初始开销小的执行模式）和顶峰性能（顶峰速度快，所以要高优化层级，即使优化需要较大的开销）
- 从高优化向低优化迁移：
- 在高优化层级做了很激进的优化，而这个激进优化的前提假设失效了
- 高优化层级不便于对代码调试
单线程机制
JS代码是执行在一条线程中的，并不能像其他语言那样申请多条线程去处理一些耗时任务来防止阻塞主线程。本身不存在多线程处理任务能力的JS通过事件驱动机制解决了这个问题
JS使浏览器拥有交互和逻辑处理能力，但JS与浏览器之间的交互是通过事件来实现的
例如，浏览器检测到了用户点击，则会传递一个点击事件通知JS，JS线程随后处理这个事件
利用该特性，当JS遇到耗时任务时，可以把这个任务交给一个由JS宿主提供的工作线程（WebWorker）去处理，待工作线程处理完后，通过事件告知JS线程，并在JS线程上执行相应的事件处理程序（callback）
JS线程和工作线程，以及浏览器事件之间的通信机制叫做事件循环（Event Loop），其中有一个Call Stack（宏任务），一个Task Queue（微任务）
- 当工作线程完成异步任务之后，会把消息推到Task Queue，消息就是注册时的回调函数
- 当CallStack为空的时候，主线程会从Task Queue里取一条消息放入Call Stack来执行
- JS主线程会一直重复这个动作，直到消息队列为空