《重学前端》学习笔记Day130

性能：前端的性能到底对业务数据有多大的影响？

性能总论

while循环快还是for循环快
0是不是比Math.floor性能好

性能优化不能着眼于局限的代码。这里提供一个观点：一切没有profiling的性能都是耍流氓。凡是真正有价值的性能优化，必定是从端到端的业务场景建立体系来考虑的。
在我的认识中，性能体系建立可以分为以下几个部分：

• 现状评估和建立指标
• 技术方案
• 执行

• 结果评估和监控

  现状评估和建立

  指标现状评估和建立指标是第一步，也是最关键的一步。作为一个工程师，指标又要考虑两个方面：一方面，对用户，什么样的性能指标更好地评估它的体验？另一方面，对公司，什么样的指标会影响业务价值？

• 性能问题可以分为很多方面，最重要的几个点是：
• 页面加载性能
• 动画与操作性能

• 内存、电池消耗
  在这里，我们仅仅是对“性能”两个字的解读，对大量的用户数据分析后，我们发现，其实这三个部分中，“页面加载性能”跟用户的流失率有非常强的关联性，而用户流失率，正是公司业务非常看重的指标。
  因此，在开始阶段，先把性能优化的重心放在页面加载性能上。
  用什么指标衡量页面加载性能？--“用户平均加载时长”、秒开率
  用户平均加载时长：存在严重的问题：当加载时间低于一定数字，用户感知就不大了。少数超长加载时长的用户（2G），会极大影响整个指标，即指标不具有普遍性。
  秒开率：即一秒之内打开的用户占用户总量的百分比。

  技术方案

  以加载为例，讲一下技术方案。
  首先，先简单分析，从输入URL后按下回车，到底发生了什么。
  浏览器原理一文中，已经讲解了浏览器的大致工作工程，但是必须理解几件事情：
  从域名到IP地址，需要DNS协议查询；
  HTTP协议是用TCP传输的，所以会有TCP建立连接过程；
  如果使用HTTPS，还有HTTPS交换证书；
  每个页面还有图片等请求。
  这么分析和实际实验的结果来看，网页加载时间，不但跟体积有关系，还跟请求数有很大关系，因此我们的技术方案大概可以这样划分：
  
  这里只是整理一部分性能优化方案，是比较重要的部分，可以看到涉及到的不仅是前端技术，还有服务端、客户端、设计团队，所以要做好性能优化，绝对不能把自己限制在局部的视角，必须整个业务一起考虑，才能有良好的收效。

  执行

此文章为8月Day2学习笔记，内容来源于极客时间《重学前端》，日拱一卒，每天进步一点点💪💪