时隔半年，继续写两篇对质量度量系统的性能优化。
刚开始做质量系统时，大家对前端的东西很不专业，写的代码比较乱，而且文件的组织格式也有问题。这里简单提一下，前段时间对前端做的2个优化点（其实就是填了前面的两个坑）：
(1)页面所需静态文件(js/css)的精简：以前的老代码，将该系统所有的js/css都引入到了一个Base.html模板中，所有的页面都集成Base.html，这样可以在页面/js中随意调用存在的各种方法；两个很大的坏处是：每个页面都要加载很多（50+）的JS/CSS文件（当然第一次访问后，在本地缓存没过期的时候，其实也还好，影响不大）、JS中的全局变量可能被另外的JS中修改、覆盖从而产生bug（我们真的还遇到过）。
解决方法：对Base.html进行清理，删除对非公共的js/css等的加载；在具体的页面中，仅使用本页面用到的JS/CSS（而不是全部都引入）。
(2)外部JS本地化：我们使用Echarts这个库来画图表，老代码中调用echarts时，直接是用的baidu上的域名（如：http://echarts.baidu.com/build/echarts)；问题就是在公司网络条件下访问echarts.baidu.com去下载js比较耗时（当然没有访问内网服务器上的JS快了）。
解决方法：将echarts下载到本地代码中，在调用时写本地相对路径，例如：
|
1 2 3 4 5 6 7 8 9 10 |
require.config({ paths:{ echarts: '/static/js/dist' } }); // 使用 require([ 'echarts', 'echarts/chart/pie' ], ...... |
这个前端优化的效果是，一个页面的静态资源请求数下降了50%，不过在具体页面加载中优势不明显（因为在内网中且静态资源是nginx在支撑，js/css下载很快），页面响应时间大约从0.48s降低为0.43s。
另外，今后还可以做多个JS合并（减少请求个数）、然后将JS压缩Minify（减少数据传输量）。可以按照Yahoo的那个经典的web site加速的规则来优化：https://developer.yahoo.com/performance/rules.html