web性能优化

背景

电梯维保项目首页第一次打开，需要等30秒，用户满意度低下，今天抽空想办法做优化。

11.png

解决

首页动画效果比较多，加载的css和js文件有60个以上，http异步请求数据有
5次。打开谷歌浏览器调试工具，发现有个echarts.js插件耗时最长4s，文件有2m，竟然是源码文件，没有经过压缩。果断采用第三方CDN加速服务加载js：http://cdn.bootcss.com/echarts/4.1.0.rc2/echarts.common.min.js

页面初始化时，上面的按月统计工单和下面的故障原因饼图统计同时启动多个ajax并发请求，造成请求阻塞。想到的解决办法：页面初始化时候，下面的故障原因先不请求数据，等用户下拉滚动条后再请求数据。

nginx优化，开启gzip 来提高页面加载速度。

用上这3招，首页加载时间降到3s。