用create-react-app创建的react应用打包之后的build js有1M之多. 采用gzip打包传输,可以节约70%左右的带宽

nginx采用gzip打包方式

在nginx配置中添加如下字段

gzip on;

gzip_buffers 32 4k;

gzip_comp_level 6;

gzip_min_length 200;

gzip_types text/css text/xml application/javascript;

gzip_vary on;

然后重启nginx即可

nginx -s reload

对比前后的文件大小和速度

压缩前 2.57s

压缩后0.883s

关于nginx的文章

nginx服务器安装及配置文件详解

nginx配置location总结及rewrite规则写法

nginx配置ssl加密（单/双向认证、部分https）

nginx做负载均衡器以及proxy缓存配置

Nginx+Keepalived实现站点高可用

相同域名多个vue应用的部署

https://www.cnblogs.com/lcosima/p/9627165.html

Nginx开启gzip压缩解决react打包文件过大的更多相关文章

  1. Nginx 开启gzip压缩(图片,文件,css)

    1.Vim打开Nginx配置文件 vim /usr/local/nginx/conf/nginx.conf 2.找到如下一段,进行修改 gzip on; gzip_min_length 1k; gzi ...

  2. Nginx开启Gzip压缩提升页面加载速度

    1.在 nginx 的conf 目录下新建 gzip.conf 文件 #开启gzip压缩 gzip on; #设置允许压缩的页面最小字节数 gzip_min_length 1k; #申请4个单位为16 ...

  3. nginx 开启gzip压缩

    Nginx开启Gzip压缩功能, 可以使网站的css.js .xml.html 文件在传输时进行压缩,提高访问速度,!  Web网站上的图片,视频等其它多媒体文件以及大文件,因为压缩效果不好,所以对于 ...

  4. nginx开启gzip压缩后导致apk包下载不能正常安装

    最后更新时间:2019/4/27 nginx一般都会开启gzip压缩,以提升传输性能. 配置如下: gzip on; gzip_comp_level 2; gzip_min_length 1k; gz ...

  5. Nginx开启gzip压缩功能

    在Nginx安装完成之后,我们可以开启Gzip压缩功能,这里Nginx默认只能对text/html类型的文件进行压缩.下面的指令为开启Gzip的指令: gzip on; gzip_http_versi ...

  6. Nginx 开启gzip 压缩

    随着nginx的发展,越来越多的网站使用nginx,因此nginx的优化变得越来越重要,今天我们来看看nginx的gzip压缩到底是怎么压缩的呢? gzip(GNU-ZIP)是一种压缩技术. 经过gz ...

  7. Nginx 开启gzip 压缩，实现基于域名的虚拟主机。

    一:gzip(GNU-ZIP)是一种压缩技术. 经过gzip压缩后页面大小可以变为原来的30%甚至更小,这样,用户浏览页面的时候速度会块得多. gzip 的压缩页面需要浏览器和服务器双方都支持,实际上 ...

  8. Nginx开启Gzip压缩

    .Vim打开Nginx配置文件 vim /usr/local/nginx/conf/nginx.conf .找到如下一段,进行修改 gzip on; gzip_min_length 1k; gzip_ ...

  9. Nginx开启Gzip压缩大幅提高页面加载速度(转)

    转自:http://www.cnblogs.com/mitang/p/4477220.html 刚刚给博客加了一个500px相册插件,lightbox引入了很多js文件和css文件,页面一下子看起来非 ...

随机推荐

  1. wifi扫描

    获取当前位置的wifi,信道,强度,mac #include "ESP8266WiFi.h" IPAddress apIP(192, 168, 4, 1); void setup( ...

  2. QTableWidgetItem class

    Help on class QTableWidgetItem in module PyQt5.QtWidgets: class QTableWidgetItem(sip.wrapper)  |  QT ...

  3. Docker 核心技术之仓库

    Docker 仓库简介 什么是Docker仓库 Docker仓库就是存放docker镜像并有docker pull方法下载的云环境 Docker仓库分为公有仓库和私有仓库. 公有仓库指Docker H ...

  4. centos关机与重启命令

    Linux centos重启命令: 1.reboot   普通重启 2.shutdown -r now 立刻重启(root用户使用) 3.shutdown -r 10 过10分钟自动重启(root用户 ...

  5. MyBatis 3源码解析(二)

    二.获取SqlSession对象 1.首先调用DefaultSqlSessionFactory 的 openSession 方法,代码如下: @Override public SqlSession o ...

  6. 虚拟机ubuntu设置静态IP与主机、外网互ping配置流程

    方案一.VMnet8(NAT模式) 1.选择自定义模式,VMnet8(NAT模式) 2.进入虚拟机,设置静态IP之前确认三者可互ping通,命令ifconfig,查看当前的IP 3.主机通过命令ipc ...

  7. NABCD--团队项目1

    N: 1.学校中有很多学生是外省的,然后不知道附近有什么地方周末可以去玩. 2.学校中学生有很多用不到的东西但是联系不到合适的买家. A: 我们可以做一个软件,通过学号注册登陆软件,这样可以防止有人去 ...

  8. How To Configure NetScaler AppFlow for SolarWinds

    How To Configure NetScaler AppFlow for SolarWinds 来源  https://support.citrix.com/article/CTX227300 A ...

  9. [HNOI2012]集合选数（状压DP+构造）

    题目要求若出现x,则不能出现2x,3x 所以我们考虑构造一个矩阵 \(1\ 2\ 4 \ 8--\) \(3\ 6\ 12\ 24--\) \(9\ 18\ 36--\) \(--\) 不难发现,对于 ...

  10. ACM在线模板

    转载自:https://blog.csdn.net/f_zyj/article/details/51594851 Index 分类细则 说起分类准则,我也是很头疼,毕竟对于很多算法,他并不是单调的,而 ...