本文目录:
- 1、Android 网络框架解压缩(gzip)浅谈
- 2、文件压缩
- 3、Nginx开启和配置Gzip压缩
- 4、前端性能优化之Gzip
- 5、gzip压缩实践
Android 网络框架解压缩(gzip)浅谈
六谈这个话题,是因为很多时间都忽略了这个因素,网络传输数据的压缩很少有人去关注,然而有时间提到这个问题的时间却一时不知道怎么回答,或者已经忘掉了这个概念...
进入正题,首先来聊聊Gzip。
Gzip是GNUZip的缩写,他是一个GNU自由软件的文件圧缩程序。
我们在进行网络传输数据时,经常用到json、xml等格式的数据,这些数据在传输前可以进行压缩,这时候就会涉及到一种压缩格式—Gzip。Gzip的压缩比率非常大,有的甚至能达到99.9%以上,可以大大减少传输内容,提高用户的传输速度,进而提高用户的体验。
比如我们通过第一个链接看一下“开源中国的新闻页”,网址如下:
;pageIndex=0pageSize=20
结果显示,这个网页没有进行压缩,源文件大小为12KB,而压缩后,文件可减小到0.01KB,可以节省99.92%的传输控件。这是什么概念呢?相当于100MB的数据经过压缩后不到1MB。
说道这里,我们先说一下Http中的Gzip技术细节
HTTP协议上的GZIP编码是一种用来改进WEB应用程序性能的技术。一般服务器中都安装有这个功能模块的,服务器端不需做改动,当浏览器支持gzip 格式的时候, 服务器端会传输gzip格式的数据。具体讲就是 http request 头中 有 "Accept-Encoding", "gzip" ,response 中就有返回头Content-Encoding=gzip ,我们现在从浏览器上访问玩啥网站都是gzip格式传输的。
同样的的道理,我们可以在android 客户端 request 头中加入 "Accept-Encoding", "gzip" ,来让服务器传送gzip 数据。
首先,客户端发请求给服务端,会带上请求头:Accept-Encoding:gzip。第二步,服务端接收到请求头后,可以选择压缩或不压缩。第三步,服务端选择压缩后,文件明显变小,同时在响应头加上Content-Encoding:gzip。第四步,客户端接收到响应后,根据响应头中是否带有Content-Encoding:gzip,判断文件是否被压缩,如果压缩就进行解压,如果没有压缩,就按照正常方式读取数据即可。
OKhttp3.4.0开始将这些逻辑抽离到了内置的interceptor中,看起来较为方便
在 BridgeInterceptor.java 这个类里边可以看到
如果header中没有Accept-Encoding,默认自动添加 ,且标记变量transparentGzip为true。
针对返回结果,如果同时满足以下三个条件:
移除 Content-Encoding、Content-Length,并对结果进行解压缩。
可以看到以上逻辑完成了,由此我们通过OkHttp源码得出以下结论:
由于引用太多源码就不写了,直接针对以上6点做结果分析
Android’s HTTP Clients
HttpURLConnection
HTTP 协议中的 Transfer-Encoding
文件压缩
将多个文件或目录合并成为一个特殊的文件
减小文件的体积
加快资源的传输
节省网络的带宽
windows: rar zip 其实支持很多类型的压缩
linux: zip tar.gz ....
windows与linux互通 建议使用: zip
格式 压缩工具
.zip zip压缩工具
.gz gzip压缩工具,只能压缩文件,会删除原文件(通常配合tar使用)
.bz2 bzip2压缩工具,只能压缩文件,会删除原文件(通常配合tar使用)
.tar.gz 先使用tar命令归档打包,然后使用gzip压缩
.tar.bz2 先使用tar命令归档打包,然后使用bzip压缩
Linux gzip工具使用
1.gzip打包与压缩 ,仅对文件有效.
gzip filename 打包
gzip -d filename.gz 解包
zcat filename.gz 查看包内文件的内容
linux本身没有gzip命令,需yum install gzip -y进行安装
gzip file #对文件进行压缩
zcat file.gz #查看gz压缩后的文件
gzip -d file.gz #解压gzip的压缩包
gzip CentOS-Vault.repo -- CentOS-Vault.repo.gz
zcat CentOS-Vault.repo.gz -- 查看不想解压的压缩包
默认情况下没有zip和unzip工具,需要进行安装 yum install zip unzip -y
1.压缩文件为zip包
zip filename.zip filename
unzip -l filename.zip #查看压缩包内容
2.压缩目录为zip包
zip -r dir.zip dir/
3.查看zip压缩包文件是否完整
zip -T filename.zip
test of filename.zip OK
4.不解压压缩查看压缩包中的内容
unzip -l filename.zip
unzip -t filename.zip #检测文件是 否都ok
5.解压zip文件包, 默认解压至当前目录
unzip filename.zip
6.解压zip内容至/opt目录
unzip filename.zip -d /opt/
tar是linux下最常用的压缩与解压缩, 支持文件和目录的压缩归档
c #创建新的归档文件
x #对归档文件解包
t #列出归档文件里的文件列表
f #指定包文件名,多参数f写最后
z #使用gzip压缩归档后的文件(.tar.gz)
j #使用bzip2压缩归档后的文件(.tar.bz2)
J #使用xz压缩归档后的文件(tar.xz)
C #指定解压目录位置
X #排除多个文件(写入需要排除的文件名称)
h #打包软链接
--exclude #在打包的时候写入需要排除文件或目录
cjf #打包tar.bz格式 *
cJf #打包tar.xz格式 使用田少,不考虑
zxf #解压tar.gz格式 *
jxf #解压tar.bz格式 *
常用
czf #打包tar.gz格式 ( )
tf #查看压缩包内容
xf #自动选择解压模式 ( )
将文件或目录进行打包压缩
tar czf test.tar.gz test/ test2/ #以gzip方式压缩
tar cjf test.tar.bz2 dir.txt dir/ #以bz2方式压缩
tar tf test.tar.gz
tar tf test.tar.bz2
tar tf test.tar.xz
tar xf test.tar.gz
tar xf test.tar.bz2
tar xf test.tar.xz
tar xf root.tar.gz -C /tmp/ #解压至指定目录
find tmp/ -type f | xargs tar czf tmp.tar.gz
tar czf tmp.tar.gz $(find /tmp/ -type f)
tar czf etc.tar.gz /etc/ --exclude=etc/services
tar czf etc.tar.gz /etc/ --exclude=etc/passwd -exclude=etc/shadow
cat pc.txt
etc/gshadow
etc/gshadow-
etc/passwd
etc/passwd
etc/shadow
etc/shadow
etc/security/opasswd
etc/pam.d/passwd
tar czXf pc.txt etc.tar.gz /etc/
yum install mariadb-server
systemctl start mariadb
mkdir /backup
tar cJf /backup/mysql.tar.xz /var/lib/mysql
tar xf /backup/mysql.tar.xz -C /
cd /var/lib/mysql
tar cJf /backup/mysql.tar.xz *
tar tf /backup/mysql.tar.xz
tar xf /backup/mysql.tar.xz C /var/lib/mysql
Nginx开启和配置Gzip压缩
nginx 是一个高性能的 Web 服务器,合理配置nginx可以有效提高网站的响应速度。
本文介绍 nginx 的 gzip 和缓存开启配置。
gzip的压缩页面需要浏览器和服务器双方都支持,实际上就是服务器端压缩,传到浏览器后浏览器解压并解析。
Nginx的压缩输出有一组gzip压缩指令来实现。
相关指令位于 http{…} 两个大括号之间。
pre Liberation Mono", "Courier New", monospace; font-size: 14px; margin-top: 0px; margin-bottom: 1rem; overflow: auto; display: block; color: rgb(33, 37, 41); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"# 开启gzip
gzip on;
gzip_min_length 1k;
gzip_comp_level 6;
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 on;
gzip_disable "MSIE [1-6].";/pre
关于具体的参数说明可以参考 nginx 的文档 。
pre Liberation Mono", "Courier New", monospace; font-size: 14px; margin-top: 0px; margin-bottom: 1rem; overflow: auto; display: block; color: rgb(33, 37, 41); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"location ~* ^.+.(ico|gif|jpg|jpeg|png)$ {
access_log off;
expires 30d;
}
location ~* ^.+.(css|js|txt|xml|swf|wav)$ {
access_log off;
expires 24h;
}
location ~* ^.+.(html|htm)$ {
expires 1h;
}/pre
其中的缓存时间可以自己根据需要修改。
前端性能优化之Gzip
由于我们团队的前端项目越来越庞大,加之Vue的SPA首屏加载特性,导致系统第一次加载速度越来越缓慢,可能达到几十秒的程度,所以为了优化用户性能体验,我们选择了开启Gzip进行文件压缩,确实达到了显著的效果。
Gzip原本用户UNIX系统的文件压缩,后来逐渐成为Internet最主流的数据压缩格式。
当用户访问我们的web站点时,服务器就将我们的网页文件进行压缩,将压缩后的文件传输到客户端,对于纯文本文件我们可以至少压缩到原大小的40%,这样大大提高了传输效率,页面便可更快的加载出来。
由于目前我们项目是使用ngxin来部署前端的,nginx自带 HttpGzip模块 , 所以我们直接对 nginx.conf 文件的http配置项进行配置即可。但相对的由于nginx自身处理请求然后压缩返回,会消耗对应的服务器内存。
测试效果
我们应尽可能减少对服务端内存的使用,毕竟服务端的资源是十分宝贵的,这里我们仍然使用nginx进行前端部署,我们在客户端替nginx处理压缩文件这一步操作,nginx便可直接使用我们压缩好的文件,下面是一个基于vue-cli配置的前端项目。
这里最好安装低版本,防止报错。
这里可以根据大家不同的配置,总之就是将webpack插件进行注册。
成功运行后,便可以在打包文件中看到.gz结尾的文件了,将打包后的文件上传到指定的nginx文件夹下。
这里需要nginx对应的插件 http_gzip_static_module ,之前我是通过yum安装的nginx,这里似乎不可以,需要手动安装。这里目录可以根据大家个人情况而定。
安装nginx
修改nginx.conf
启动nginx服务
这里我们虽然服务端js文件夹里只有.gz格式的文件(其他的文件已删除),但客户端却成功读取了。
无论是服务端与客户端进行gzip的压缩,我们都大大缩小了文件体积,给用户带来了更好的体验。
服务端处理gzip优点是只需配置一下即可,无需复杂操作,但缺点是会消耗服务器内存。
客户端处理gzip优点是无需服务器进行文件压缩,减少服务器内存消耗,但配置起来相比服务端gzip会稍加繁琐。
Nginx中文文档
什么是GZIP,有什么优势,如何开启GZIP?
vue-cli4 开发项目中开启gzip压缩,优化打包体积,提升加载速度
Nginx gzip static静态压缩
配置nginx直接使用webpack生成的gz压缩文件,而不用nginx自己压缩
gzip压缩实践
为提高网页加载速度,启用 gzip 缩减资源的大小是非常常见的手段。现代浏览器均支持 gzip 压缩,并会为HTTP请求自动协商此类压缩。
本文将对 gzip 的实践和原理做一个简单的总结。
web服务器在接收到浏览器的请求之后,会检查浏览器可以接受哪些压缩方法,详情可见下图。
浏览器在请求头中会带上 Accept-Encoding 这个参数来说明自己支持哪些内容编码方式。
而服务端返回的 Response Headers 中则存在一个 Content-Encoding ,用来说明数据的压缩方法。
几乎所有的浏览器都已经支持了 gzip ,并且有请求头的验证,所以基本不需要担心兼容相关的问题。
压缩前后的体积前后差异,可以在控制台中看到。可以说,对于js、css文件的压缩率还是比较可观的。
经过这种方式的配置,在服务端响应请求的时候会对文件进行压缩,之后返回压缩过后的内容。不过压缩这一过程多多少少会占用一些服务端的性能,具体压缩的程度,也就是 gzip_comp_level 设置的值也会影响到占用性能的多少,接下来我们来看一些网上搜集到的数据,了解不同值的设置对文件大小和CPU占用的影响。
可以看到,压缩级别从0到1时,文件大小明显减小,CPU消耗略微上涨。而在之后文件减小的速率明显放缓,在达到了5之后继续增加压缩级别,文件的体积也几乎没有缩小,但CPU消耗却有较为明显的上涨。
根据结论可以看出,如果是在服务端使用 gzip 压缩的话,考虑到性能和压缩率的取舍,将压缩级别设置为一个较低的值,比如2之类的,是比较合理的。
我们也可以选择在打包构建项目的时候就对文件进行gzip压缩
这边以打包一个 webpack 的前端项目为例
运行构建命令后可以看到,在生成 .js 和 .css 的同时还生成了对应的 .gz 文件。
在这种方式的压缩中,我们完全可以把压缩等级设置为一个比较高的值(默认),毕竟只是略微影响打包的时间,却能获取一个更小的体积的包,还是比较值得的。
以 nginx 为例,静态压缩需要使用 http_gzip_static_module 这个模块,这个模块不是默认的,应使用 --with-http_gzip_static_module 的配置参数启用它
之后再配置中添加
这样便可开启静态压缩。
需要注意以下几点:
【gzip压缩】的内容来源于互联网,如引用不当,请联系我们修改。
网友留言: