蛙蛙推荐：五分钟搞定网站前端性能优化

用pagespeed或yslow会发现大多扣分都发生在如下几个项目上

1. js,css没有mini化
2. 多个js没有合并成一个
3. 静态资源没有进行gzip压缩
4. 静态资源没有设置过期时间

mini化及合并脚本

先安装uglifyJS

npm install uglify-js -g

按顺序把所有需要加载的脚本mini化并合并成一个大的all.js, 或者分下类压缩成多个。(如果用了seajs或requirejs请使用相关的spm和r.js)

uglifyjs jquery.min.js mustache.js underscore.js highcharts.js jquery.vector-map.js china-zh.js warning_main.js  > all.js

在html页面上重新引入all.js

<script src="/static/js/all.js"></script> 

启用gzip压缩

配置下nginx就行，如下

gzip on;
gzip_http_version 1.1;
gzip_comp_level 2;
gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;

设置过期时间

在nginx相关的location配置节(一般是静态目录配置节)里增加如下选项

expires 1h;

总结

经过以上优化pagespeed和yslow会从30多分提高到80分左右。