首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >Nginx 中启用 Gzip 压缩以优化网页加载速度

Nginx 中启用 Gzip 压缩以优化网页加载速度

原创
作者头像
神秘泣男子
发布2024-12-25 13:59:35
发布2024-12-25 13:59:35
1.2K0
举报
文章被收录于专栏:nginx专栏nginx专栏

启用 Gzip 压缩是一种简单高效的优化方法,可以显著减少网页传输的数据量,从而提高网页加载速度。Nginx 提供了强大的 Gzip 模块支持,以下是配置 Gzip 压缩的详细步骤及测试方法,帮助你快速完成这一优化。

下是源码包安装的nginx 如果你是rpm 那么只有路径不一样 可以跟我路径对照来配置修改 (小白请绕道)

1. 配置网页压缩

目的

启用 Gzip 压缩,减少传输数据量,提高网页加载速度。


操作步骤

检查 gzip 模块是否启用

Nginx 的 gzip 功能依赖 ngx_http_gzip_module 模块。如果该模块未编译到 Nginx 中,则 gzip 功能无法使用。

  1. 检查是否启用了 gzip 模块:
代码语言:javascript
复制
nginx -V 2>&1 | grep gzip

如果输出中包含 --with-http_gzip_module,说明 gzip 模块已编译。如果没有,则需要重新编译 Nginx 并添加该模块。

  1. 如果需要重新编译 Nginx,可以参考以下步骤:
    • 下载 Nginx 源码包。
    • ./configure 时添加 --with-http_gzip_module 参数。
    • 重新编译并安装 Nginx。
  2. 编辑 Nginx 主配置文件:
代码语言:javascript
复制
vim /usr/local/nginx/conf/nginx.conf

http 块中添加以下内容:

代码语言:javascript
复制
http {
    ...
    gzip on;                       # 启用 Gzip 压缩
    gzip_types text/plain text/css application/json application/javascript application/xml+rss; # 压缩类型
    gzip_min_length 1024;          # 最小压缩大小
    gzip_comp_level 5;             # 压缩级别
    ...
}

  1. 测试配置文件语法:
代码语言:javascript
复制
nginx -t

2.重启 Nginx 服务:

代码语言:javascript
复制
systemctl restart nginx

测试步骤

  1. 使用 curl 测试 Gzip 压缩:
代码语言:javascript
复制
curl -I --compressed http://<your-nginx-ip>/

预期输出:响应头中包含以下字段:

代码语言:javascript
复制
Content-Encoding: gzip

补充扩展:

1. gzip on;

  • 作用: 启用 Gzip 压缩功能。
  • 说明: 这是开启 Gzip 压缩的核心指令。如果未添加此指令,Gzip 压缩功能不会生效。

2. gzip_types

  • 作用: 指定哪些 MIME 类型的响应内容需要进行 Gzip 压缩。
  • 示例配置:
代码语言:javascript
复制
gzip_types text/plain text/css application/json application/javascript application/xml+rss;
  • 常见 MIME 类型:
    • text/plain:普通文本文件。
    • text/css:CSS 样式表文件。
    • application/json:JSON 格式数据。
    • application/javascript:JavaScript 文件。
    • application/xml+rss:RSS 格式文件。
  • 注意: 默认情况下,text/html 类型总是会被压缩,无需显式指定。

3. gzip_min_length

  • 作用: 设置允许压缩的响应内容的最小长度(单位:字节)。
  • 示例配置:
代码语言:javascript
复制
gzip_min_length 1024;
  • 说明:
    • 如果响应内容的大小小于指定的值(如 1024 字节),则不进行压缩。
    • 设置此值可以避免压缩小文件,因为小文件压缩后可能会导致额外的开销,反而增加传输时间。

4. gzip_comp_level

  • 作用: 设置 Gzip 压缩的级别。
  • 示例配置:
代码语言:javascript
复制
gzip_comp_level 5;
  • 取值范围:1 到 9
    • 1:压缩速度最快,但压缩率较低。
    • 9:压缩率最高,但压缩速度较慢,消耗更多 CPU 资源。
  • 推荐值: 一般建议设置为 45,在压缩率和性能之间取得平衡。

总结

通过启用 Gzip 压缩,Nginx 能够有效减少数据传输量,提升用户的网页加载体验。在实际应用中,可以根据具体业务需求调整压缩级别和压缩类型,以达到最佳效果。如果你有其他关于 Nginx 压缩优化的经验或问题,欢迎留言分享,让我们一起交流学习!

成功的路上没有捷径,只有不断的努力与坚持。如果你和我一样,坚信努力会带来回报,请关注我,点个赞,一起迎接更加美好的明天!你的支持是我继续前行的动力!"

"每一次创作都是一次学习的过程,文章中若有不足之处,还请大家多多包容。你的关注和点赞是对我最大的支持,也欢迎大家提出宝贵的意见和建议,让我不断进步。"

神秘泣男子

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. 配置网页压缩
    • 目的
    • 操作步骤
      • 检查 gzip 模块是否启用
    • 测试步骤
      • 1. gzip on;
      • 2. gzip_types
      • 3. gzip_min_length
      • 4. gzip_comp_level
    • 总结
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档