RAIL是一个以用户为中心的性能模型，它把用户的体验拆分成几个关键点（例如，tap，scroll，load），并且帮你定义好了每一个的性能指标。 用户的输入到响应的时间不超过100ms，给用户的感受是瞬间就完成了。 事件处理函数在50ms内完成，考虑到idle task的情况，…

之前我也研究过很多性能相关的文档和博客，发现现在的性能相关的文章 90% 都是之前有过的东西，但是目前的性能优化只能做到如今的样子了吗？ 很显然，肯定不是的，技术本来就是个逐渐进步的过程

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

Vue 框架通过数据双向绑定和虚拟 DOM 技术，帮我们处理了前端开发中最脏最累的 DOM 操作部分， 我们不再需要去考虑如何操作 DOM 以及如何最高效地操作 DOM；但 Vue 项目中仍然存在项目首屏优化、Webpack 编译配置优化等问题，所以我们仍然需要去关注 Vue …

Webpack是现在主流的功能强大的模块化打包工具，在使用Webpack时，如果不注意性能优化，有非常大的可能会产生性能问题，性能问题主要分为开发时打包构建速度慢、开发调试时的重复性工作、以及输出文件质量不高等，因此性能优化也主要从这些方面来分析。本文主要是根据自己的理解对《深…

可以点击查看 在线演示，以及 完整代码。 首先，需要了解 CSS3 的 transform ，用 transform 进行元素的变换，这是实现的关键。 实际上，上面的写法可以算作 CSS 提供的语法糖。了解计算机图形学的同学可能知道，计算机完成图像变换实际上使用的实现是矩阵。 …

随着互联网的发展，API变的至关重要。根据统计，目前市面上有上千万的开发者，互联网项目超过10亿，保守统计涉及的 API 数量大约有 100 亿。这么大基数的API，只要解决某些共有的痛点，将会是非常有意义的事情。我们总结了API管理方面的问题，发现与API相关的文档，调试，测…

众所周知，对于页面内容比较丰富的网站，dom的解析会很复杂，这样就会导致首屏加载过慢，对于图片很丰富的网站，我们知道可以使用图片懒加载来提高网站的响应速度，我在我的另外一篇文章中写过，有兴趣的点击这里。像淘宝、京东等等的首页都是经过懒加载处理的，他们会先渲染出骨架，然后懒加载的…

现在的 web 应用，内容一般都很丰富，站点需要加载的资源也特别多，尤其要加载很多 js 文件。js 文件从服务端获取，体积大小决定了传输的快慢；浏览器端拿到 js 文件之后，还需要经过解压缩、解析、编译、执行操作，所以，控制 js 代码的体积以及按需加载对前端性能以及用户体验…