现在的程序使用单页面应用，因此程序会在一开始就会加载页面JS。如果带宽不够，那么会影响页面下载速度。

我们可以使用NGINX 进行压缩，加快文件下载。

gzip  on;

    gzip_min_length 1k;

    gzip_buffers 4 16k;

    gzip_http_version 1.0;

    gzip_comp_level 3;

    gzip_types text/plain application/javascript application/css  text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;

    gzip_vary off;

    gzip_disable "MSIE [1-6]\.";
gzip_comp_level 是压缩等级，可以使用 1-9 ,值越大，压缩比越高，但是对CPU的消耗也就越高。

实际测试：
未开启压缩的情况：

开启压缩的情况

可以看到压缩比达到了 3倍，如果改为 9 的话，最大的文件会压缩到 1.6M.

使用nginx 压缩的更多相关文章

  1. Nginx - 压缩模块

    1. 前言 在 Nginx 中与网页压缩相关的模块有两个:一个是 HttpGzipModule,另一个是 HttpGzipStaticModule.前者用于启用在文件传输过程中使用 gzip 压缩,而 ...

  2. 使用Nginx压缩文件、设置反向代理缓存提高响应速度

    Gzip压缩: 最开始,这个竟然要6m多(大到不寻常),响应的速度3分多钟. 所以先对返回的文件进行gzip压缩.判断返回的资源是否有使用gzip压缩,观察响应头部里面,如果没有 Content-En ...

  3. nginx压缩,缓存

    https://www.darrenfang.com/2015/01/setting-up-http-cache-and-gzip-with-nginx/ https://www.linuxdashe ...

  4. Nginx -- Gzip 压缩功能作用

    1.对应的压缩参数说明# 开启gzip压缩功能gzip on; # 设置允许压缩的页面最小字节数,页面字节数从header头的Content-Length中获取.默认值是0,不管页面多大都进行压缩,建 ...

  5. Nginx反向代理、负载均衡、动静分离、缓存、压缩、防盗链、跨域访问

    一.反向代理 1.在192.168.189.130机器启动tomcat服务,http://192.168.189.130:8080/ 访问服务正常 2.在192.168.189.131机器配置ngin ...

  6. Nginx GZIP 压缩

    [ HTTP 开启gzip ] gzip on; // 开启 nginx在线实时压缩数据流: gzip_min_length 1k; // 允许压缩的页面最小字节 gzip_buffers 32k; ...

  7. 在windows、linux中开启nginx的Gzip压缩大大提高页面、图片加载速度<转>

    为了降低tomcat服务的压力,把页面上的图片采用windows版的nginx进行加载,由于有些图片比较大,加载特别的慢,所以在nginx中打开了gzip的压缩功能.加载图片的速度快了很多. 通过站长 ...

  8. Nginx启用Gzip压缩js无效的原因

    Nginx启用gzip很简单,只需要设置一下配置文件即可完成,可以参考文章Nginx如何配置Gzip压缩功能.不过,在群里常有人提到,他们的网站Gzip压缩虽然成功了,但检测到JS仍然没有压缩成功,这 ...

  9. Nginx 高级配置-压缩功能

    Nginx 高级配置-压缩功能 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.Nginx压缩相关参数概述 1>.gzip on | off; Nginx支持对指定类型的文 ...

  10. nginx的压缩、https加密实现、rewrite、常见盗链配置

    Nginx 压缩功能 ngx_http_gzip_module #ngx_http_gzip_module 用gzip方法压缩响应数据,节约带宽 #启用或禁用gzip压缩,默认关闭 gzip on | ...

随机推荐

  1. ASP.NET Core – Globalization & Localization

    前言 之前就写过 2 篇, 只是写的很乱, 这篇作为整理版. Asp.net core (学习笔记 路由和语言 route & language) Asp.net core 学习笔记之 glo ...

  2. SEO – 大杂烩

    参考: Google SEO 官网 Docs Zac 大神博客 Globalization 国际化语言 The Ultimate Guide to Multilingual and Multiregi ...

  3. EF Core – Library use EF

    前言 写 Library 有时候会用到 database, 会想用 EF 来维护. 比如 Identity, IdentityServer, OpenIddict, 这些 Library 都有使用到 ...

  4. Figma 学习笔记 – Team Library Style and Component

    Design System 我们做设计通常会 Follow 一个 Design System, 比如 Material Guide. 里头会定义 Font, Color, Effect (Elevat ...

  5. Blazor开发框架Known-V2.0.11

    Known今天发布了V2.0.11版本,本次版本添加了系统WebApi在线测试,系统菜单样式配置,表格支持用户设置栏位显隐和顺序,系统上下文支持静态组件与后端交互,以及对PgSQL进行了详细的测试,修 ...

  6. [TK] Tourist Attractions

    题目描述 给出一张有 \(n\) 个点 \(m\) 条边的无向图,每条边有边权. 你需要找一条从 \(1\) 到 \(n\) 的最短路径,并且这条路径在满足给出的 \(g\) 个限制的情况下可以在所有 ...

  7. Kubernetes基础（kube-apiserver？kube-controller-manager？kube-scheduler？kubelet？kube-proxy？kubectl？）（十一）

    一.kube-apiserver API Server 提供了资源对象的唯一操作入口,其它所有组件都必须通过它提供的 API 来操作资源数据.只有 API Server 会与 etcd 进行通信,其它 ...

  8. iManager微服务（云套件）配置https证书流程步骤

    本文使用的是10.1版本,需要手动去配置证书,未来版本会考虑进行界面化配置. 一.提前准备 1. 证书需要准备三个文件 *.key *.crt *.keystore 2. 需要知道自己创建的微服务是哪 ...

  9. docker安装及基本的镜像拉取

    docker 使用存储库安装 卸载它们以及相关的依赖项. yum remove docker \ docker-client \ docker-client-latest \ docker-commo ...

  10. neo4j 统计多个节点之间关系总和的写法-包含多个collect合并成一个并去重操作

    在使用neo4j数据库时,会遇到计算与指定节点产生关联的数量统计需求,例如指定6个节点1,2,3,4,5,6需要找出与这6个节点中4个节点有关联的节点(要求排除这6个节点的数据) 先看实现查询语句: ...