经常被开发者问及像素渲染管道流的细节问题，它每一步是怎样触发的，何时触发的、为什么会触发。 这篇文章就是为了解答这些疑惑的，你将了解到像素是如何渲染到屏幕的。 注意：以下讲解基于 Blink 内核的 Chrome 浏览器。例如像layout 或 style calcs 等步骤运…

页面从0，1字节流到最后展现在你面前，这里面渲染机制肯定很复杂，这篇文章将分步总结浏览器的渲染原理，以及回流、重绘、合成。

前言最近做性能检测工具，很多知识点不清楚，打算查缺补漏，补一补。接下来从官方提供的性能检测工具Lighthouse(灯塔)开始我们的学习，简单介绍了下Lighthouse的一些点。

作为一个合格的前端工程师，浏览器相关的工作原理是我们进行性能优化的基石，我之前也强调过知识体系的重要性，这部分原理性的内容就是知识体系中的重要部分，必须牢牢掌握才能面对瞬息万变的实际场景，针对性地给出实际方案，而不是背诵各种开发军规和性能优化的条例，这样很难发现真正的问题所在,…

浏览器主进程：只有一个，主要控制页面的创建、销毁、网络资源管理、下载等。 第三方插件进程：每一种类型的插件对应一个进程，仅当使用该插件时才创建。 GPU进程：最多一个，用于3D绘制等。 浏览器渲染进程(浏览器内核)：每个Tab页对应一个进程，互不影响。 这里我们只考虑输入的是一…

最近做 web 性能采集分析，一直觉得跟用户交互无关的采集都放在 onLoad 或 DOMContentLoaded 中很不合理。 一番搜索，发现 web 页面也是有生命周期的。一番研究，解决了如何避免干扰用户采集信息的困惑。 提供了一系列的生命周期钩子函数，方便开发者能够在不…