Chromium

Chromium 浏览器内核中，来自前端的内容如何在最终转换成为屏幕上的各个像素点，也就 是浏览器内核渲染过程，这是一个复杂的工程上的一系列步骤。对于这些复杂的步骤我们需 要把握的方面包括该过程每个阶段的设计思想、数据模型、数据模型的交互。深入而仔细地 理解上述内容，有利与我们阅读庞大源码中始终保持清醒找准定位。下面我将基于我对 Life of a Pixel 的理解仔细来讨论这个过程。 Life of a Pixel 输入与输出 首先需要谈谈输入与输出，这一系列步骤的输入成为 Web Content。它由一系列现有协议所 定义的一套描述 Web 内容的文本主要组成，当然也包括其他引用内容。现有的协议（我们 常称为编程语言），通常是 HTML、CSS 与 JavaScript。这三者分别有定义了 Web 内容的 结构内容、样式、逻辑。但这并非严格分工，在当下流行的前端设计思想（前后端分离）中 JavaScript 正在承担着越来越多的职责。JavaScript 本身也正在不断地变得独立，近年来 逐渐跳出浏览器这个平台来独立发挥其作用（node.js、react-vr）。 另一方面，谈谈输 出。如何绘制屏幕上的像素，涉及到计算机图形学方面的理论与工程。在传统上，我们可以 认为计算机向屏幕输出内容经历了以下步骤。应用软件将其想要表达的图形内容转换成为对 操作系统与图形相关的函数库的调用（OpenGL、Direct X 等），这些函数库通过操作系统 中安装驱动程序及其他操作系统有关服务向硬件（GPU 等）传送数据与指令，并操纵硬件的 计算核心与存储器（GPU 等）完成光栅化等步骤、最终将硬件（GPU 等）存储器中的最终内 容转化为向屏幕输出的信号。在这方面，由函数库（OpenGL）所提供的 API 都是比较低级 的。 举个例子，原来我也做过 OpenGL 相关的编程，虽然现代 OpenGL 提供一些模型与协 议（如管线等）来简化工作，但是其提供的模型以及依照模型设计的 API 带有明显的硬件 气息。对于 OpenGL 来说，调用者要精确输入预设的或者利用 GPU 程序计算出的数据其所 绘制内容的在几何坐标系下的位置、颜色以及绘制顺序。 由输入输出来大致推断，浏览器 的工作是按照先行前端协议（前端编程语言）及其附属多媒体、数据等方面的内容精确理解 前端开发者对于 Web 页面的描述，并通过数据的层层流动与转换计算推断出图形函数库所 需的各类信息。现行前端协议的复杂性与兼容性与鲁棒性要求使得这一步骤的实现十分复杂 与庞大。而对于性能与稳定的要求更提升了设计与实现上的难度。实现这一系列不仅仅是技 术上，而且也是软件工程上的难题。 页面生命周期综述 由上述对于输入与输出的讨论，我们可以理解 Chromium 团队提出以下有关于页面生命周 期。 ...