一个老同事，前几天跟我说他挨了领导的骂，说他滥用will-change这个属性，知其然不知其所以然。 我有点茫然，但是当他给我介绍他的用法的时候，我想说的是，“骂你的队伍能加我一个不咯？”

引言 给组内的项目都在CICD流程上更新上了性能守卫插件，效果也还不错，同事还疯狂夸奖我 接下里进入我们的此次的主题吧 但是会出现两个问题，如果采用第一种方式，使用lighthouse查看性能指标

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

创建一个 Sentry 项目 Step 1: 创建项目 Step 2: 创建警报规则 将 Sentry SDK 引入您的前端代码 前置条件 Step 1: 获取代码 Step 2: 安装 SDK St

一般来讲一个成熟的产品，运营与产品团队需要关注用户在产品内的行为记录，通过用户的行为记录来优化产品，研发与测试团队则需要关注产品的性能以及异常，确保产品的性能体验以及安全迭代。

在刚开始学前端的时候，那时候开发的应用总是在用户的设备中出现一些报错，开发者只知道这个型号的设备出现这个问题，但对其他信息却全然不知，比如说其他操作系统、其他设备型号、其他页面会有这个报错吗，这个报错

现如今的页面越来越复杂，一个页面往往承载着大量的元素，最常见的就是一些电商页面，数以万计的商品列表是怎么保证渲染不卡顿的，大家在面对这种长列表渲染的场景下，一般都会采用分页或者虚拟列表来减缓页面一次性

在实际工作中，我们很少会遇到一次性需要向页面中插入大量数据的情况，但是为了丰富我们的知识体系，我们有必要了解并清楚当遇到大量数据时，如何才能在不卡主页面的情况下渲染数据，以及其中背后的原理。 我们对十万条记录进行循环操作，JS的运行时间为187ms，还是蛮快的，但是最终渲染完成…

一、什么是 Tree Shaking Tree-Shaking 是一种基于 ES Module 规范的 Dead Code Elimination 技术，它会在运行过程中静态分析模块之间的导入导出，确