现代浏览器内部揭秘
[译] 现代浏览器内部揭秘（第一部分） – 掘金 (juejin.cn)
[译] 现代浏览器内部揭秘（第二部分） – 掘金 (juejin.cn)
[译] 现代浏览器内部揭秘（第三部分） – 掘金 (juejin.cn)
[译] 现代浏览器内部揭秘（第四部分） – 掘金 (juejin.cn)
【译】浏览器如何工作：在现代web浏览器场景的之下 – 掘金 (juejin.cn)
https://segmentfault.com/a/1190000016335571 像素的一生
怎样阅读 Chromium 源码？ – 知乎 (zhihu.com)
参考：
一个浏览器引擎toy：https://limpet.net/mbrubeck/2014/08/08/toy-layout-engine-1.html
toy技术实现分析：https://tigercosmos.xyz/post/2018/02/browser/browser_series_33/
2，调试浏览器tips
Dev Tips – Developer Tips by Umar Hansa (umaar.com)
- (18条消息) Chromium网页加载过程简要介绍和学习计划_罗升阳的博客-CSDN博客 dom，render tree，graphic tree
《Chromium内核原理之blink内核工作解密》
《Chromium内核原理之多进程架构》
《Chromium内核原理之进程间通信(IPC)》
《Chromium内核原理之网络栈》
《Chromium内核原理之网络栈HTTP Cache》
《Chromium内核原理之Preconnect》
《Chromium内核原理之Prerender》
《Chromium内核原理之cronet独立化》
https://zhuanlan.zhihu.com/p/34957535 裁剪出net模块
https://zhuanlan.zhihu.com/p/62381831 http rtsp服务
https://zhuanlan.zhihu.com/p/143422507 http client
(22条消息) 浏览器的渲染机制（一）_hancao97的博客-CSDN博客_inline-flow
(22条消息) 浏览器的渲染机制（二）_hancao97的博客-CSDN博客
(22条消息) 【精简版】浏览器渲染机制（完整流程概述）_hancao97的博客-CSDN博客
Activate
在Commit之后，Draw之前有一个Activate操作。Raster和Draw都发生在合成器线程里的Layer List上，但是我们知道Raster操作是异步的，有可能需要执行Draw操作的时候，Raster操作还没完成，这个时候就需要解决这个问题。
于是它将LayerTree分为了:
PendingTree：负责接收commit，然后将Layer进行Raster操作
ActiveTree：会从这里取出光栅化好的Layer进行draw操作。
在 Impl 端有三个 cc::LayerImpl 树，分别是 Pending,Active,Recycle 树。Commit 阶段提交的目标其实就是 Pending 树， Raster 的结果也被存储在了 Pending 树中。Raster阶段会把图块转换成位图，存储在内存中，当然这个内存地址的引用也会被记录，记录在 cc::PictureLayerImpl中（以后会用！）。
在 Activate 阶段，Pending 树中的所有 cc::LayerImpl 会被复制到 Active 树中，为了避免频繁的创建 cc::LayerImpl 对象，此时 Pending 树并不会被销毁，而是退化为 Recycle 树。
和主线程 cc::Layer 树不同，cc::LayerImpl 树并不是自己维护树形结构的，而是由 cc::LayerTreeImpl 对象来维护 cc::LayerImpl 树的。三个 Impl 树分别对应三个 cc::LayerTreeImpl 对象。
Draw
Draw 阶段并不执行真正的绘制，而是遍历 Active 树中的 cc::LayerImpl 对象，并调用它的 cc::LayerImpl::AppendQuads 方法创建合适的 viz::DrawQuad 放入 CompositorFrame 的 RenderPass 中。cc::LayerImpl 中的资源会被创建为 viz::TransferabelResource 存入 CompositorFrame 的资源列表中。至此一个 viz::CompositorFrame 对象创建完毕，最后通过 cc::LayerTreeFrameSink 接口将该 CompositorFrame 发送到给 viz 进程（GPU进程）进行渲染。
到了Draw这个步骤，当每个图块都被光栅化之后，合成器线程会为每个图块生成draw quads（在屏幕的指定位置绘制图块的指令，也包含了属性树里面的变换，特效等操作），这些draw quads会被封装在CompositorFrame对象里面，CompositorFrame对象也是Render Process（渲染进程）的产物，它会被提交到Gpu Process中。
Draw指的就是 把光栅化的图块，转换成draw quads的过程。 最后CompositorFrame会发送到viz进程（GPU进程）进行最后的渲染。
Original: https://www.cnblogs.com/bigben0123/p/16445336.html
Author: Bigben
Title: 浏览器内核入门
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/551323/
转载文章受原作者版权保护。转载请注明原作者出处！