提升首屏的加载速度，是前端性能优化中最重要的环节，这里笔者梳理出一些 `常规且有效` 的首屏优化建议 通过对比优化前后的性能变化，来验证方案的有效性，了解并掌握其原理

所有的性能优化都围绕着两大层面两小层面实现，核心层面是网络层面和渲染层面，辅助层面是时间层面和体积层面，而辅助层面则充满在核心层面里，笔者通过本文整理出关于前端性能优化的九大策略和六大指标

1. 页面的呈现流程 浏览器把获取到的HTML代码解析成1个DOM树，HTML中的每个tag都是DOM树中的1个节点，根节点就是我们常用的document对象。DOM树里包含了所有HTML标签，包括display:none隐藏，还有用JS动态添加的元素等。 浏览器把所有样式(用…

First Contentful Paint (FCP) 是 Web 性能优化中的关键指标之一，表示浏览器从用户输入 URL 到渲染页面首个内容的时间。一个良好的 FCP 体验不仅能提升用户对网站的第

Chrome Devtool Performance 是大家常用的页面性能分析工具，当你使用它来分析页面加载性能的时候会生成如下图所示的报告。 图中包含了以下几个重要的时间点：DCL, L, FP, FCP, FMP, LCP。这里我把前两个和后面几个分开来讲，因为它们分属于不…