前端优化（一）：开启nginx gzip压缩

最近接手一个项目，特别乱，网站加速速度特别慢，成了大问题。
来和我一起开启前端优化之路吧！

我着重从几个方面入手整理：

• 整理项目，清除冗余文件。
  • 卸载未用到的npm包。
  • 去除未用到的文件。
• 抽取公用组件和方法，去掉重复的代码。
• 抽取第三方js
• 使用tinypng压缩图片
• 使用路由懒加载
• 开启nginx gizp压缩

由于清除项目冗余包、文件和代码各项目不同，本文不做重点讲解。
本文分成几篇分别着重介绍从以下几个方面如何进行优化：

• 开启nginx gzip压缩
• 使用路由懒加载
• 抽取第三方js

一、开启nginx gzip压缩

这一步本是我做了以上优化后最后的一步，但考虑到并不冲突，优化写了。 在前端方面做完项目的整理以后，网站加载速度仍保持在3秒左右，其中火狐为将近3秒，谷歌为3秒半左右。 开启nginx gzip压缩后，加载速度从3秒降到了1秒，效果惊人。 下面来详细讲一下如何配置：

gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
gzip_comp_level 2;
gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_vary off;
gzip_disable "MSIE [1-6]\.";

在nginx的配置里，加入上面的代码。

下一章直通车：前端优化（二）：使用路由懒加载