gzip压缩JavaScript
为了提高客户端的体验效果,RIA开发逐渐兴起。这样会项目中会充斥的大量的JavaScript代码,与此同时会消耗客户端浏览器性能。对于 Ext 实现的 one page one application ,对于外网访问也就产生了噩梦似的加载(除非你的网速足够快)。为了缓解(不是解决,从代码加载方面考虑)加载慢的问题可以对JavaScript进行压缩。JavaScript的gzip静态压缩方法
一、将js格式文件压缩成gzjs格式。使用gzip.exe打包压缩后的JS文件,最后生成xx.js.gz,把xx.js.gz文件改成xx.gzjs。压缩实例: ext-all.js (610KB), gzip.exe压缩后为ext-all.gzjs(168KB)。
附:gzip使用方法,在命令行下输入: gzip -9 ext-all.js ext-all.js.gz
修改ext-all.js.gz的后缀名ext-all.gzjs(注:也可以通过gzip -h命令查看帮助)
下载地址:http://www.gzip.org
二、在项目web.xml中加入过滤器。
代码如下:
<filter> <filter-name>GzipJsFilter</filter-name> <filter-class>net.kangsoft.util.GzipJsFilter</filter-class> <init-param> <param-name>headers</param-name> <param-value>Content-Encoding=gzip</param-value> </init-param> </filter> <filter-mapping> <filter-name>GzipJsFilter</filter-name> <url-pattern>*.gzjs</url-pattern> </filter-mapping>
三、加入过滤类
package net.kangsoft.util; import java.io.IOException; import java.util.HashMap; import java.util.Iterator; import java.util.Map; import java.util.Map.Entry; import java.util.Set; import javax.servlet.Filter; import javax.servlet.FilterChain; import javax.servlet.FilterConfig; import javax.servlet.ServletException; import javax.servlet.ServletRequest; import javax.servlet.ServletResponse; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class GzipJsFilter implements Filter { Map headers = new HashMap(); public void destroy() { } public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException { if (req instanceof HttpServletRequest) doFilter((HttpServletRequest)req, (HttpServletResponse)res, chain); else chain.doFilter(req, res); } public void doFilter(HttpServletRequest request, HttpServletResponse response, FilterChain chain) throws IOException, ServletException { request.setCharacterEncoding("UTF-8"); for (Iterator it = this.headers.entrySet().iterator(); it.hasNext(); ) { Map.Entry entry = (Map.Entry)it.next(); response.addHeader((String)entry.getKey(), (String)entry.getValue()); } chain.doFilter(request, response); } public void init(FilterConfig config) throws ServletException { String headersStr = config.getInitParameter("headers"); String[] headers = headersStr.split(","); for (int i = 0; i < headers.length; ++i) { String[] temp = headers[i].split("="); this.headers.put(temp[0].trim(), temp[1].trim()); } } }
四、在需导入js的页面head里面添加导入文件,如:<script type="text/javascript" src="js/ext3/ext-all.gzjs"></script>
配置Apache,Tomcat的gzip压缩功能
HTTP 压缩可以大大提高浏览网站的速度,它的原理是,在客户端请求网页后,从服务器端将网页文件压缩,再下载到客户端,由客户端的浏览器负责解 压缩并浏览。相对于普通的浏览过程HTML ,CSS,Javascript , Text ,它可以节省40%左右的流量。更为重要的是,它可以对动态生成的,包括CGI、PHP , JSP , ASP , Servlet,SHTML等输出的网页也能进行压缩,压缩效率惊人
对于Tomcat5.0以后的版本是支持对输出内容进行压缩的。使用的是gzip压缩格式
对于Tomcat5.0以后的版本是支持对输出内容进行压缩的. 使用的是gzip压缩格式
下面是tomcat5.5.20 中的$tomcat_home$/conf/server.xml的原内容
< Connector port ="80" maxHttpHeaderSize ="8192" maxThreads ="150" minSpareThreads ="25" maxSpareThreads ="75" enableLookups ="false" redirectPort ="8443" acceptCount ="100" connectionTimeout ="20000" disableUploadTimeout ="true" URIEncoding ="utf-8" /> <!-- Note : To disable connection timeouts, set connectionTimeout value to 0 --> <!-- Note : To use gzip compression you could set the following properties : compression="on" compressionMinSize="2048" noCompressionUserAgents="gozilla, traviata" compressableMimeType="text/html,text/xml" -->
从上面的第8行内容可以看出,要使用gzip压缩功能,你可以在Connector实例中加上如下 属性即可
1) compression="on" 打开压缩功能
2) compressionMinSize="2048" 启用压缩的输出内容大小,这里面默认为2KB
3) noCompressionUserAgents="gozilla, traviata" 对于以下的浏览器,不启用压缩
4) compressableMimeType="text/html,text/xml" 压缩类型
我这里的配置内容为:
<Connector port="80" maxHttpHeaderSize="8192" maxThreads="150" minSpareThreads="25" maxSpareThreads="75" enableLookups="false" redirectPort="8443" acceptCount="100" connectionTimeout="20000" disableUploadTimeout="true" URIEncoding="utf-8" compression="on" compressionMinSize="2048" noCompressionUserAgents="gozilla, traviata" compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain" /> <!-- Note : To disable connection timeouts, set connectionTimeout value to 0 --> <!-- Note : To use gzip compression you could set the following properties : compression="on" compressionMinSize="2048" noCompressionUserAgents="gozilla, traviata" compressableMimeType="text/html,text/xml" -->
tomcat 开启Gzip :
1.找到Tomcat 目录下的conf下的server.xml,并找到如下信息
Connector port="8080" maxHttpHeaderSize="8192" maxThreads="150" minSpareThreads="25" maxSpareThreads="75" enableLookups="false" redirectPort="8443" acceptCount="100" connectionTimeout="20000" disableUploadTimeout="true"
将它改成如下的形式(其实在上面代码的下面已经有了,将他们打开而已。)
<!-- Define a non-SSL HTTP/1.1 Connector on port 8080 --> <Connector port="8080" maxHttpHeaderSize="8192" maxThreads="150" minSpareThreads="25" maxSpareThreads="75" enableLookups="false" redirectPort="8443" acceptCount="100" connectionTimeout="20000" disableUploadTimeout="true" compression="on" compressionMinSize="2048" noCompressionUserAgents="gozilla, traviata" compressableMimeType="text/html,text/xml" >
这样,就能够对html和xml进行压缩了,如果要压缩css 和 js,那么需要
<Connector port="8080" ......... compressableMimeType="text/html,text/xml,text/css,text/javascript" >
甚至可以压缩图片:
<Connector port="8080" ......... compressableMimeType="text/html,text/xml,text/css,text/javascript,image/gif,image/jpg" >
一旦启用了这个压缩功能后,我们怎么来测试压缩是否有效呢?首先Tomcat是根据浏览器请求头中的accept-encoding来判断浏览器是否支持压缩功能,如果这个值包含有gzip,就表明浏览器支持gzip压缩内容的浏览,所以我们可以用httpclient来写一个这样的简单测试程序.
import org.apache.commons.httpclient.HttpClient; import org.apache.commons.httpclient.methods.GetMethod; public class HttpTester { public static void main(String[] args) throws Exception{ HttpClient http = new HttpClient(); GetMethod get = new GetMethod("http://www.dlog.cn/js/prototype.js"); try{ get.addRequestHeader("accept-encoding", "gzip,deflate"); get.addRequestHeader("user-agent", "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Alexa Toolbar; Maxthon 2.0)"); int er = http.executeMethod(get); if(er==200){ System.out.println(get.getResponseContentLength()); String html = get.getResponseBodyAsString(); System.out.println(html); System.out.println(html.getBytes().length); } }finally{ get.releaseConnection(); } } }
执行这个测试程序,看看它所输出的是什么内容,如果输出的是一些乱码,以及打印内容的长度远小于实际的长度,那么恭喜你,你的配置生效了,你会发现你网站的浏览速度比以前快多了。
对于Apache而言,有两种情况
1)针对Apache2.0之前的版本,它原本是不支持 的,不过可以通过添加第三方的module_gzip模块来启用
2)针对Apache2.0及之后的版本,Apache提供支持, 不过不叫gzip,而叫mod_deflate
下面就对Apache2.0及之后的版本作一个说明
1) 去掉#LoadModule headers_module modules/mod_headers.so前面的注释#,
2) 添加LoadModule deflate_module modules/mod_deflate.so
3) 在VirtualHost中添加
<Location "/"> SetOutputFilter DEFLATE BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary Header append Vary User-Agent env=!dont-vary </Location>
我这里面有一个完整的演示
# 加载deflate模块 LoadModule headers_module modules/mod_headers.so LoadModule deflate_module modules/mod_deflate.so <VirtualHost *:80> DocumentRoot f:/apacheTest <Location "/"> SetOutputFilter DEFLATE BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary Header append Vary User-Agent env=!dont-vary </Location> </VirtualHost>
gzip压缩JavaScript的更多相关文章
- GZIP压缩优化
使用gzip优化web应用(filter实现) 相关知识: gzip是http协议中使用的一种加密算法,客户端向web服务器端发出了请求后,通常情况下服务器端会将页面文件和其他资源,返回到客户端,客户 ...
- IIS7配置Gzip压缩 JS压强失败的原因
开启配置HTTP压缩(GZip) 在IIS7中配置Gzip压缩相比IIS6来说实在容易了许多,而且默认情况下就是启用GZip压缩的.如果没有,则可以再功能视图下找到“压缩”项,进入之后就会看到“静态内 ...
- Nginx 开启gzip 压缩
随着nginx的发展,越来越多的网站使用nginx,因此nginx的优化变得越来越重要,今天我们来看看nginx的gzip压缩到底是怎么压缩的呢? gzip(GNU-ZIP)是一种压缩技术. 经过gz ...
- gzip压缩及测试方法【转载】
Nginx开启Gzip压缩大幅提高页面加载速度 http://www.veryhuo.com/a/view/51706.html 刚刚给博客加了一个500px相册插件,lightbox引入了很多js文 ...
- Nginx -- Gzip 压缩功能作用
1.对应的压缩参数说明# 开启gzip压缩功能gzip on; # 设置允许压缩的页面最小字节数,页面字节数从header头的Content-Length中获取.默认值是0,不管页面多大都进行压缩,建 ...
- iis7 压缩js文件和启用gzip压缩
压缩js文件 打开IIS 7的配置文件:c:\windows\system32\inetsrv\config\applicationhost.config 在<staticContent loc ...
- 修改Apache配置文件开启gzip压缩传输
转自:http://down.chinaz.com/server/201202/1645_1.htm 最近无事研究一些Web的优化,用工具page speed检测网站时发现还没有开启gzip压缩,于是 ...
- IIS:开启GZIP压缩效率对比及部署方法
HTTP压缩 HTTP压缩是在Web服务器和浏览器间传输压缩文本内容的方法.HTTP压缩采用通用的压缩算法如GZIP等压缩HTML.JavaScript或CSS文件.压缩的最大好处就是降低了网络传输的 ...
- 【nginx】关于gzip压缩
有这么一段配置文件 gzip on # 默认值: gzip off # 开启或者关闭gzip模块 gzip_static off; # nginx对于静态文件的处理模块 # 该模块可以读取预先压缩的g ...
随机推荐
- python27+django数据库配置常见问题
mysql缺乏模块,需要安装,建议去http://sourceforge.net/projects/mysql-python/files/mysql-python/下源码编译,或者安装msi文件htt ...
- web开发中禁止因为网速慢导致重复提交数据
var checkSubmitFlg = false; function check() { if (!checkSubmitFlg) { ...
- switch……case不能匹配字符串的方法 .xml
pre{ line-height:1; color:#d1653c; background-color:#000000; font-size:16px;}.sysFunc{color:#566d68; ...
- 我的新计划 《2Dof Racing Simulator》2014/3/9 20:30:00
最近好久都没来网站上了,也没心思和时间去弄VellLock和升级V&View了.一直在蕴量这做一件大玩意. 最近一直都很忙,忙着做数电课设,还有各种实验,可是我的心思不在这些东西上,当然除了数 ...
- dom cookie记录用户名
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- SQL Server数学函数
数学函数 1.计算绝对值ABS ABS函数对一个数值表达式结果计算绝对值(bit数据类型除外),返回整数. 语法结构: ABS(数值表达式) 返回值:与数值表达式类型一致的数据 示例: ) --输出 ...
- 第三百五十八天 how can I 坚持
万事要有度,不要话唠,也不能不说,把握好分寸,今天貌似又说多了. 加了天班,理了个发,还有老爸明天来北京. 还有同学聚会没去,还有金龙让去吃鱼,没去. 还有.小米视频通话还行,能远程控制桌面, 还有, ...
- 一个效果很华丽的仿桌面APP,却胜似Launcher
开发Android APP的同学是否对于Launcher实现的绚丽效果而痴迷呢?什么,连Android Launcher是什么都不知道.好吧,拿起侬的手机,在解锁后的首页界面上左右滑动滑动,体验体验, ...
- [翻译]创建ASP.NET WebApi RESTful 服务(8)
本章讨论创建安全的WebApi服务,到目前为止,我们实现的API都是基于未加密的HTTP协议,大家都知道在Web中传递身份信息必须通过HTTPS,接下来我们来实现这一过程. 使用HTTPS 其实可以通 ...
- V7承保 bug代码
v7 bug1