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

闲鱼在业务的快速迭代过程中，app 的长列表滑动流畅度逐步恶化，对用户浏览内容体验产生伤害。闲鱼作为国内 flutter 应用的先驱，APP 以 flutter 和原生 Native 的混合工程存在。这里分别就 Android 原生、flutter 页面和大家分享我们的优化思路…

Web Workers API：Worker 构造函数及如何观察 Dedicated Worker 等。 下面我们开始步入正题，为了让大家能够更好地理解和掌握 Web Workers，在正式介绍 Web Workers 之前，我们先来介绍一些与 Web Workers 相关的基…

最近花了一些时间在项目的性能优化上，背后做了很多工作，但是最后依然没有达到自己想要的结果，有些失望，但是还是记录下自己的执着。 性能优化总结：减少请求次数、减小资源大小、提高响应和加载速度、优化资源加载时机、优化加载方式。 站在用户视角的主观的可感知的性能。 站在开发者视角的可…

C M Pandey 原作，授权 New Frontend 翻译。 在这篇文章里，我会跟大家分享我是如何让自己的作品集网站在 0.8 秒内加载完成的。 1. 不要使用太大的 DOM 树 我的作品集网站包含 487 个 DOM 元素，DOM 树的深度是 13，每层最多 20 个子…

性能优化相关的文章其实网上挺多，但是大部分都是在讲如何优化性能，也就是讲方法论。但是在实际工作中，如何量化性能优化也是相当重要的一环。今天本文会介绍谷歌提倡的七个用户体验指标（也可以认为是性能指标），每个指标分别根据以下几点讲解： 首次绘制，FP（First Paint），这个…

程序的运行需要内存。只要程序提出要求，操作系统或者运行时就必须供给内存。所谓的内存泄漏简单来说是不再用到的内存，没有及时释放。为了更好避免内存泄漏，我们先介绍Javascript垃圾回收机制。 在C与C++等语言中，开发人员可以直接控制内存的申请和回收。但是在Java、C#、J…

1. 意外的全局变量 2. 遗忘的定时器 3. 使用不当的闭包 4. 遗漏的 DOM 元素 5. 网络回调 可以抓取两份快照，两份快照中间进行内存泄漏操作，最后再比对两份快照的区别，查看增加的对象是什么，回收的对象又是哪些，如上图。

今天突然想到一个问题，let的块级作用域，以及闭包的变量引用功能很有意思（这脑洞咋联想到一起的，囧）。。闭包的使用会影响浏览器的GC过程。那么： 由于是异步调用打印函数，所以等调用这个函数时，循环已经结束，i变成了6,所以连着打印5个6。 这种情况下直接通过let, 实际上给每…