读取JS压缩gzjs格式文件

本文介绍了一种优化方法,通过将大型JS文件压缩成gzjs格式,并在项目配置中添加过滤器,来减小文件体积,提高网页浏览速度。包括使用gzip.exe进行压缩、在web.xml中加入过滤器、编写过滤类实现自动转换和优化过程,以及如何在页面中正确导入优化后的JS文件。
摘要由CSDN通过智能技术生成

最近做的Ext项目Ext的插件都比较大,对于网页的浏览速度也是非常不容乐观的,于是就需要对所加载的js文件进行优化,其中一个方法就是对于较大的js文件可以进行压缩。压缩成gzjs格式,但是gzjs后缀名的文件又不能被浏览器所认识,得需要对服务器端做些处理。 

一、将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中加入过滤器。 
代码如下: 
1.<filter>   
2.      <filter-name>GzipJsFilter</filter-name>   
3.      <filter-class>net.kangsoft.util.GzipJsFilter</filter-class>   
4.      <init-param>   
5.          <param-name>headers</param-name>   
6.          <param-value>Content-Encoding=gzip</param-value>   
7.      </init-param>  
8.</filter>  
9.   <filter-mapping>  
10.   <filter-name>GzipJsFilter</filter-name>  
11.   <url-pattern>*.gzjs</url-pattern>  
12.</filter-mapping>  

三、加入过滤类。 

代码如下: 



Java代码  
1.package net.kangsoft.util;  
2.  
3.import java.io.IOException;  
4.import java.util.HashMap;  
5.import java.util.Iterator;  
6.import java.util.Map;  
7.import java.util.Map.Entry;  
8.import java.util.Set;  
9.import javax.servlet.Filter;  
10.import javax.servlet.FilterChain;  
11.import javax.servlet.FilterConfig;  
12.import javax.servlet.ServletException;  
13.import javax.servlet.ServletRequest;  
14.import javax.servlet.ServletResponse;  
15.import javax.servlet.http.HttpServletRequest;  
16.import javax.servlet.http.HttpServletResponse;  
17.  
18.public class GzipJsFilter  
19.implements Filter  
20.{  
21.Map headers = new HashMap();  
22.  
23.public void destroy() { }  
24.  
25.public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain)  
26.  
27.throws IOException, ServletException {  
28.    if (req instanceof HttpServletRequest)  
29.      doFilter((HttpServletRequest)req, (HttpServletResponse)res, chain);  
30.    else  
31.      chain.doFilter(req, res);  
32.}  
33.  
34.public void doFilter(HttpServletRequest request, HttpServletResponse response,  
35.  
36.FilterChain chain)  
37.    throws IOException, ServletException  
38.{  
39.    request.setCharacterEncoding("UTF-8");  
40.    for (Iterator it = this.headers.entrySet().iterator(); it.hasNext(); ) {  
41.      Map.Entry entry = (Map.Entry)it.next();  
42.      response.addHeader((String)entry.getKey(), (String)entry.getValue());  
43.    }  
44.    chain.doFilter(request, response);  
45.}  
46.  
47.public void init(FilterConfig config) throws ServletException {  
48.    String headersStr = config.getInitParameter("headers");  
49.    String[] headers = headersStr.split(",");  
50.    for (int i = 0; i < headers.length; ++i) {  
51.      String[] temp = headers[i].split("=");  
52.      this.headers.put(temp[0].trim(), temp[1].trim());  
53.    }  
54.}  
55.}  

四、在需导入js的页面head里面添加导入文件,如:<script type="text/javascript" 

src="js/ext3/ext-all.gzjs"></script> 

至此已经大功告成,在我这边测试通过,如大家在运行过程中有问题,请发信息给我。

读取JS压缩gzjs格式文件

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值