在开发好页面后，如何让页面更快更好的运行，是区分一个程序猿技术水平和视野的一个重要指标。所以面试时，面试官总会问你一个问题，如何进行性能优化呢？ 如果你这时是头脑一片空白，或是像之前的我一样，靠死记硬背或是之前的经历，答一下压缩代码，打包代码，雪碧图，cdn，事件代理，这说明你…

假设您正在访问一个网站，如果Web内容不在几秒内显示在屏幕上，那么作为用户您可能会选择关闭标签页，转去浏览其他页面从而代替这个网页的内容。但是作为Web开发者，您可能希望跟踪请求与导航的详细信息，这样你就可以知道为什么这个网页的速度在变慢。 W3C性能工作组提供了可以用来测量和…

——本文是对之前同名文章的修正，将所有webpack3的内容更新为webpack4，以及加入了笔者近期在公司工作中学习到的自动化思想，对文章内容作了进一步提升。 作为互联网项目，最重要的便是用户体验。在举国“互联网+”的热潮中，用户至上也已经被大多数企业所接收，特别是在如今移动…

我在开发中遇到Navigation Timing API中的connectStart等时间节点并不是标准时间戳，而是0或者一个很小的数值，导致指标数据计算出错，尤其是IOS设备。原因如下: IOS设备通过浏览器的前进后退按钮进入的页面，Navigation Timing API…

在前端开发中，性能一直都是被大家所重视的一点，然而判断一个网站的性能最直观的就是看网页打开的速度。其中提高网页反应速度的一个方式就是使用缓存。缓存技术一直一来在WEB技术体系中扮演非常重要角色，是快速且有效地提升性能的手段。 一个优秀的缓存策略可以缩短网页请求资源的距离，减少延…

说起前端性能监控系统，绝大部分人应该不陌生，也许你正在使用，又或者你只是听说过。总之它就是这样频繁的出现在我们的工作之中。 那么做一个前端性能监控系统，我们应该统计一些什么维度的信息呢？那些数据真正对于我们有用呢？它适用的场景又有哪些呢？有很多的问题需要回答，再做之前我们应该回…

作为互联网项目，最重要的便是用户体验。在举国“互联网+”的热潮中，用户至上也已经被大多数企业所接收，特别是在如今移动端快速发展的时代，我们的网页不仅只是呈现在用户的PC浏览器里，更多的时候，用户是通过移动产品浏览我们的网页。加之有越来越多的开发者投入到Web APP和Hybri…

本文作者是来自360导航的前端开发工程师 Berwin，W3C 性能工作组成员，同时也是《深入浅出Vue.js》（待出版）的作者。 本文转载自奇舞周刊。

今天介绍下 Chrome dev tools 家族的一个小兄弟，它在 Chrome 57 之前叫作「Timeline」，而现在换了个更长的马甲 —— 「Performance」，毕竟名字要「长～～～～～～～～～」更能吸引注意。 也许你曾不经意启动过这个工具，看见里面五颜六色的图…