前端性能优化这件事情上， 我认为他是20%的理论， 加上至少80%的实践， 甚至很多理论本身也都是我们具体的业务场景中实践出来的。前端技术日新月异， 性能方案永远都在更迭， 所以一定要形成自己的学习思路。
从一道面试题说起
从输入URL到页面加载完成， 发生了什么？
我们站在性能优化的角度， 一起简单的复习一遍这个经典的过程：首先我们需要通过dns域名解析系统， 将url解析为对应的ip地址， 然后与这个ip地址确定的那台服务器简历起tcp网络连接， 随后我们向服务端抛出我们的http请求，服务端处理完我们的请求之后， 把目标数据放在http响应里返回给客户端， 拿到响应数据的浏览器可以开始走一个渲染的流程。渲染完毕，页面便呈现给了用户，并时刻等待响应用户的操作
我们将这个过程切分为如下的过程片段：
- dns解析
- tcp连接
- http请求抛出
- 服务端处理请求 http响应返回
- 浏览器拿到响应数据， 解析响应内容 把解析的结果展示给用户
我们任何一个用户端的产品， 都需要把这5个过程滴水不漏的考虑到自己的性能优化方案内，反复权衡，从而打磨出用户满意的速度
从原理到实践：各个击破
接下来要做的事件， 就是正对这五个过程进行分解， 各个提问， 各个击破。
具体来说， dns解析花时间， 能不能尽量减少解析次数或者把解析前置？
能——浏览器dns缓存和dns prefetch
tcp每次的三次握手都急死人，有没有解决方案？
有——长连接、与连接、接入spdy协议
如果说这两个过程的优化往往需要我们的团队和服务器工程师写作完成， 前端单方面可以做的努力有限，那么http请求呢？在减少请求次数和减小请求体积方面， 我们应该是专家， 再者， 服务器越远， 一次请求就越慢， 那部署时就把静态资源放在离我们更近的cdn上是不是就能快一些
以上提到的都是网络层面的性能优化， 再往下走就是浏览器端的性能优化——这部分涉及资源加载优先化、服务端渲染、浏览器缓存机制的利用、dom树的构建、网页排版和渲染过程、回流与重绘的考量、dom操作的合理规避等等——这正是前端工程师可以真正一展拳脚的地方， 学习这些知识， 不仅可以帮助我们从更根本上提升页面性能， 更能够大大加深个人对浏览器底层原理， 运行机制的理解
总的来说
我们将从网络层面和渲染层面两个大的维度来逐个点亮前端性能优化的技能树。
这两个维度的知识面貌各有千秋， 在网络层面，我们需要学习一些必须的理论基础作为前置知识。这部分的学习或许不需要写特别多的代码， 但需要对每一个知识点理解透彻， 进而应用到自己日常优化的决策中去。网络层面结束后， 由本地储存开始， 渐渐过度到浏览器这一端的优化。