Node.js服务器启用Gzip压缩

简介: Node.js服务器如何启用Gzip压缩

Gzip是什么

复制大神们的解释吧:

GZIP最早由 Jean-loup GaillyMark Adler创建,用于 UNIX系统的文件压缩。我们在 Linux中经常会用到后缀为 .gz的文件,它们就是 GZIP格式的。现今已经成为 Internet 上使用非常普遍的一种数据压缩格式,或者说一种文件格式。 HTTP协议上的 GZIP编码是一种用来改进 WEB应用程序性能的技术。大流量的 WEB站点常常使用 GZIP压缩技术来让用户感受更快的速度。这一般是指 WWW服务器中安装的一个功能,当有人来访问这个服务器中的网站时,服务器中的这个功能就将网页内容压缩后传输到来访的电脑浏览器中显示出来.一般对纯文本内容可压缩到原大小的 40%.这样传输就快了,效果就是你点击网址后会很快的显示出来.当然这也会增加服务器的负载. 一般服务器中都安装有这个功能模块的.

Gzip压缩率

举个例子,通过webpack打包后的js文件比较大,虽然我们可以利用chunk功能将文件分开混淆打包,但是总体积还是不小;这时候看看利用gzip压缩的效果:

启用Gzip前

启用Gzip后

对比其中三个文件前后压缩大小:

文本类文件:

  • iview.min.js: 429kb -> 109kb,压缩比74.6%
  • base.min.js: 309kb -> 81.7kb,压缩比73.56%
  • style.min.css: 207kb -> 30.9kb,压缩比85%

图片:

  • 图片1: 63.2kb -> 63.2kb,压缩比0%

我们看到文本类文件的压缩效果非常显著,但是图片体积没变。看一下文本类的http响应头是有gzip压缩过:

image.png

而图片的没有:
image.png

这是因为一般对于图片(png,jpg等)使用gzip的效果不好甚至恰得其反,所以一般都默认对图片不进行gzip压缩。

node.js启用gzip

下面说一下node的express框架如何使用gzip:
1.安装一个compression依赖:

npm install compression

2.调用:

var compression = require('compression')
var app = express();

//尽量在其他中间件前使用compression
app.use(compression());

基本的使用就是这样就ok了,另外如果想只对某些请求使用此功能,可以使用它的过滤方法:

app.use(compression({filter: shouldCompress}))

function shouldCompress (req, res) {
  if (req.headers['x-no-compression']) {
    // 这里就过滤掉了请求头包含'x-no-compression'
    return false
  }

  return compression.filter(req, res)
}

其他的功能请参考compression文档

在nginx如何开启

nginx也支持gzip压缩。下面为配置方法:

#on为启用,off为关闭
gzip on;

#设置允许压缩的页面最小字节数,页面字节数从header头中的Content-Length中进行获取。默认值是0,不管页面多大都压缩。建议设置成大于1k的字节数,小于1k可能会越压越大。
gzip_min_length 1k;

#获取多少内存用于缓存压缩结果,‘4 16k’表示以16k*4为单位获得
gzip_buffers 4 16k;

#gzip压缩比(1~9),越小压缩效果越差,但是越大处理越慢,所以一般取中间值
gzip_comp_level 5;

#对特定的MIME类型生效,其中'text/html’被系统强制启用
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php;

感谢阅读!

相关文章
|
1月前
|
机器学习/深度学习 JavaScript Cloud Native
Node.js作为一种快速、可扩展的服务器端运行时环境
Node.js作为一种快速、可扩展的服务器端运行时环境
47 8
|
2月前
|
JavaScript
使用Node.js创建一个简单的Web服务器
使用Node.js创建一个简单的Web服务器
|
2月前
|
JavaScript
使用node.js搭建一个express后端服务器
Express 是 Node.js 的一个库,用于搭建后端服务器。本文将指导你从零开始构建一个简易的 Express 服务器,包括项目初始化、代码编写、服务启动与项目结构优化。通过创建 handler 和 router 文件夹分离路由和处理逻辑,使项目更清晰易维护。最后,通过 Postman 测试确保服务正常运行。
81 1
|
2月前
|
数据采集 JavaScript 搜索推荐
服务器端渲染(SSR)(Nuxt+Next.js)
服务器端渲染(SSR)技术在服务器上生成页面HTML,提升首屏加载速度和SEO效果。Nuxt.js和Next.js分别是基于Vue.js和React.js的流行SSR框架。Nuxt.js提供自动化路由管理、页面级数据获取和布局系统,支持SSR和静态站点生成。Next.js支持SSR、静态生成和文件系统路由,通过`getServerSideProps`和`getStaticProps`实现数据获取。SSR的优点包括首屏加载快、SEO友好和适合复杂页面,但也会增加服务器压力、开发限制和调试难度。选择框架时,可根据项目需求和技术栈决定使用Nuxt.js或Next.js。
|
2月前
|
缓存 负载均衡 监控
性能优化:Node.js高效服务器开发技巧与最佳实践
【10月更文挑战第29天】在Node.js服务器开发中,性能优化至关重要。本文介绍了几种高效开发的最佳实践,包括使用缓存策略、采用异步编程、实施负载均衡和性能监控。通过示例代码展示了如何实现这些技术,帮助开发者构建更快、更稳定的Node.js应用。
89 2
|
3月前
|
JSON JavaScript 前端开发
使用 Node.js 和 Express 构建 RESTful API 服务器
【10月更文挑战第3天】使用 Node.js 和 Express 构建 RESTful API 服务器
|
3月前
|
Web App开发 JavaScript 前端开发
使用Node.js和Express框架构建Web服务器
使用Node.js和Express框架构建Web服务器
|
3月前
|
JSON JavaScript 前端开发
使用JavaScript和Node.js构建简单的RESTful API服务器
【10月更文挑战第12天】使用JavaScript和Node.js构建简单的RESTful API服务器
31 0
|
3天前
|
机器学习/深度学习 人工智能 PyTorch
阿里云GPU云服务器怎么样?产品优势、应用场景介绍与最新活动价格参考
阿里云GPU云服务器怎么样?阿里云GPU结合了GPU计算力与CPU计算力,主要应用于于深度学习、科学计算、图形可视化、视频处理多种应用场景,本文为您详细介绍阿里云GPU云服务器产品优势、应用场景以及最新活动价格。
阿里云GPU云服务器怎么样?产品优势、应用场景介绍与最新活动价格参考
|
2天前
|
存储 运维 安全
阿里云弹性裸金属服务器是什么?产品规格及适用场景介绍
阿里云服务器ECS包括众多产品,其中弹性裸金属服务器(ECS Bare Metal Server)是一种可弹性伸缩的高性能计算服务,计算性能与传统物理机无差别,具有安全物理隔离的特点。分钟级的交付周期将提供给您实时的业务响应能力,助力您的核心业务飞速成长。本文为大家详细介绍弹性裸金属服务器的特点、优势以及与云服务器的对比等内容。