标签：send vuejs 加载 base ima warning 压缩 algo 应用部署
使用vuejs开发的单页应用，打包部署上线后，发现首屏启动时间达到了惊人的10s左右，于是开始优化，目前使用到的总结如下：
1、抽取css文件
new ExtractTextPlugin({
filename: '[name].[hash].css',
allChunks: true
}),2、模块化抽取
new webpack.optimize.CommonsChunkPlugin({
// name: 'vendors',
// filename: 'vendors.[hash].js'
name: ['vender-exten', 'vender-base'],
minChunks: Infinity
}),对应的entry是这么写的：
entry: {
main: '@/main',
'vender-base': '@/vendors/vendors.base.js',
'vender-exten': '@/vendors/vendors.exten.js'
},3、gzip代码压缩
new CompressionWebpackPlugin({ //gzip 压缩
asset: '[path].gz[query]',
algorithm: 'gzip',
test: new RegExp(
'\\.(js|css)$' //压缩 js 与 css
),
threshold: 10240,
minRatio: 0.5
}),4、代码压缩
new webpack.optimize.UglifyJsPlugin({
comments: false, // 去除注释
compress: { // 压缩
warnings: false
}
}),省这个开启后特别是gzip开启后，性能提升十分明显，测试时发现首屏加载时间下降了80%左右，由之前的10s+一下下降到2s下，nginx配置如下：
sendfile on;
#tcp_nopush on;
#keepalive_timeout 0;
keepalive_timeout 65;
gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
#gzip_http_version 1.0;
gzip_comp_level 4;
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript image/jpeg image/gif image/png;
gzip_vary off;
gzip_disable "MSIE [1-6]\.";标签：send vuejs 加载 base ima warning 压缩 algo 应用部署
原文地址：https://www.cnblogs.com/vipzhou/p/9114090.html
