页面优化的目的
从用户角度：优化能够让页面加载得更快，对用户操作响应更及时，提高用户使用的体验
从服务商角度：优化能够减少页面请求数，减小请求所占用带宽，节省可观的资源
1. 资源压缩合并，减少http的请求
图片，JS，CSS等资源的打包压缩
利用CSS Sprites合并CSS小图片，减少请求
代码结构优化，高复用，低耦合，减少重复代码
2. 非核心代码异步加载(异步请求http)
样式表置于顶部，脚本置于页面底部，通过异步加载的方式，避免页面资源引入时，造成的阻塞
3. 利用浏览器缓存
利用浏览器缓存，强缓存或者协商缓存，给网络资源设定有效期，用户可以重复使用本地的缓存，减少对源服务器的请求，减少网络带宽的消耗，间接降低服务器的压力
并且减少网络延迟，加快页面打开速度
4. 使用CDN
CDN指的是内容分发网络。其基本思路是尽可能的避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节，使内容传输的更快、更稳定
CDN比起大多数托管服务来说更适合作为网络来处理网站的流量，CDN的主要目标和实际的基础架构设置旨在帮助提供闪电般的网站
CDN(Content Distribute NetWork，内存分发网络)的本质上仍然是一个缓存，而且将数据缓存在离用户最近的地方，是用户以最快速度获取数据。
CDN一般缓存的是静态资源，如图片，文件，CSS，脚本，静态页面等。这些文件访问频率很高，将其缓存在CDN可极大改善网页的打开速度
5. 预解析DNS
DNS请求虽然占用很少的带宽，但会有很高的延迟，在移动网络会更加明显，通过DNS预解析可以很好的降低延迟。
浏览器在https协议下默认dns预解析不可以，可以通过设置打开
<meta http-equiv="x-dns-prefetch-control" content="on"> <link rel="dns-prefetch" href="//host_name_to_prefetch.com">
6. 图片懒加载
对于图片较多的网站，可以通过图片懒加载，按需加载，减少http请求及资源下载，减少了服务端的压力，并且可以明显页面响应速度，增强用户体验
7. Reflow和Repaint
页面在进行reflow和repiant时，需要重新验证并计算渲染树，会比较消耗页面性能。所以我们应尽量减少reflow和repaint
例如，可以将修改元素样式的操作积攒一批，然后统一做一个reflow。
8. DOM相关优化
DOM操作是脚本中最消耗性能的一类操作，好在vue框架的虚拟dom较好的解决了这个问题，在使用过程中，减少reflow和repaint操作，可以较好的提升页面性能
9. 减少Cookie存储
去掉不必要的cookie，将cookie大小减小到最小。
由于cookie在访问对应的域名的资源时，会通过http请求发送到服务器，因此，减小http请求，能减小http报文的大小，提高响应速度。
并且设置合理的过期时间，也就是利用强缓存或者协商缓存。
10.服务端渲染
使用SSR(服务端渲染)后端渲染，数据直接输出到HTML中。这一点在vue框架中有很好的实现
11. http请求保持keep-Alive
获取静态资源之前，要建立通道。如果每次获取静态资源都要建立通道，会加大传输的时间。
在vue框架中，我们可以通过keep-alive将状态保存在内存中，防止重复渲染DOM
12. 避免重定向
浏览器访问页面时，通过重定向发起两次请求，会极大的影响性能，除非不可避免的登陆校验等等的，尽量避免重定向