该文章我于2010年发表于新浪博客。
最近在学习Ext，遇到一个问题，就是Ext加载的很慢，Firefox中稍微好一点，IE加载的时候尤其的慢。听说JS可以压缩以提高传输速度，所以就上网找了一下，最后找了一个tk-filters的Jar包，解决了问题。
Ext框架做出来的界面很漂亮，漂亮的东西加载的时候也就会耗费时间。要使用Ext框架必须引入Ext的JS文件，其中ext-all.js文件642K，ext-all.css文件135K，这是两个必须的文件，另外ext-all-debug.js文件有2.56M。
去http://sourceforge.net/projects/filterlib/网站下载tk-filters文件，然后解压开来，将里边的tk-filters.jar文件复制到Web工程的WebRoot/WEB-INF/lib目录下。在web.xml文件中加上几个filter，代码如下所示：
<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <!-- GZIPFilter Definition --> <filter> <filter-name>GZipFilter</filter-name> <filter-class> com.tacitknowledge.filters.gzipfilter.GZIPFilter </filter-class> </filter> <!-- CacheFilter Definition --> <filter> <filter-name>CacheFilter</filter-name> <filter-class> com.tacitknowledge.filters.cache.CacheHeaderFilter </filter-class> </filter> <!-- ClusterCheckFilter Definition --> <filter> <filter-name>ClusterFilter</filter-name> <filter-class>com.tacitknowledge.filters.clustercheck.ClusterCheckFilter</filter-class> </filter> <filter-mapping> <filter-name>GZipFilter</filter-name> <url-pattern>*.js</url-pattern> </filter-mapping> <filter-mapping> <filter-name>GZipFilter</filter-name> <url-pattern>*.css</url-pattern> </filter-mapping> <filter-mapping> <filter-name>CacheFilter</filter-name> <url-pattern>*.js</url-pattern> </filter-mapping> <filter-mapping> <filter-name>CacheFilter</filter-name> <url-pattern>*.css</url-pattern> </filter-mapping> <filter-mapping> <filter-name>ClusterFilter</filter-name> <url-pattern>*.js</url-pattern> </filter-mapping> <filter-mapping> <filter-name>ClusterFilter</filter-name> <url-pattern>*.css</url-pattern> </filter-mapping> <filter-mapping> <filter-name>CacheFilter</filter-name> <url-pattern>*.gif</url-pattern> </filter-mapping> <filter-mapping> <filter-name>CacheFilter</filter-name> <url-pattern>*.jpg</url-pattern> </filter-mapping> <filter-mapping> <filter-name>CacheFilter</filter-name> <url-pattern>*.png</url-pattern> </filter-mapping> </web-app>其中GZipFilter定义的是压缩过滤器，用于压缩JS及CSS文件，CacheFilter定义的是缓存过滤器，在第一次请求后会将mapping的js和css文件缓存在本地，这样第二次请求的时候就不用再下载这些文件，以减少传输的数据量，提高访问的速度。
接下来创建一个属性文件，文件名为：tk-filters.properties，将这个文件放在classes目录下，如果用IDE的话就直接在src目录中创建就行了，IDE会自动将src中的文件映射到classes目录中的。tk-filters.properties文件的内容如下：
# # This properties file controls the behavior of the various # filters available in the Tacit Knowledge filters package. # # Each filter has its own set of configuration directives, # prefixed with the filter name, that controls that specific # filter's behavior # ######################################################################### # ClusterCheck ######################################################################### # A frequent problem when clustering is that applications use the session # in a non-clusterable way, so The "ClusterCheckFilter" instruments the # application server's sessions with checks to see if this is a problem. ClusterCheckFilter.Enabled=true # Its possible to check for modifications to session objects after # they have been set in to the session. This is a problem for sessions # that are replicated in a copy-on-write fashion ClusterCheckFilter.UnsetModificationsCheck=false # Its possible to check serialized size to ensure high performance clustering ClusterCheckFilter.ByteSizeCheck=false # Aggregate size is important for containers that serialize the whole session # every time. An example would be a database-backed session store. # An aggregate size limit will also cap the maximum RAM used by sessions, # allowing you to quantify the RAM necessary for peak loads. ClusterCheckFilter.AggregateByteSizeLimit=30720 # Attribute size is important because each time an attribute is put in a # session, it has to be serialized and persisted to a cluster peer, or # to a database (depending on clustering implementations). Thus, very large # session attributes will be a performance problem. ClusterCheckFilter.AttributeByteSizeLimit=20480 # ClusterCheck errors can return a 500 error to the client # in order to have "fail-fast" behavior, if this is turned on. # This is good for test machines, but is usually too aggressive for production. ClusterCheckFilter.ClientError=true ######################################################################### ######################################################################### # GZIPFilter ######################################################################### # A performance boost can be achieved by sending data from the application # server to the client using the Gzip encoding. This incurs a small CPU # cost to gain a large network benefit. The GZIPFilter, when enabled, # transparently Gzip encodes all data after it leaves the application, # but before its transmitted to the client. # WARNING: GZIPFilter is currently not recommended for production use. # It does not send all data under certain conditions. GZIPFilter.Enabled=true # Its possible for the GZIPFilter to log statistics about the compression # ratios and byte savings it is achieving. This turns that on or off. GZIPFilter.LogStats=false ######################################################################### ######################################################################### # CacheFilter ######################################################################### # A server can send expiration headers to the client, enabling the client # to confidently cache certain pieces of static content. This eliminates # unnecessary conditional GETs from the client to validate the freshness of # content. If the application is on a server that doesn't do that, this # filter can be enabled and mapped to static content (images, javascript, # css files, etc), potentially reducing network traffic a great deal. CacheFilter.Enabled=true # This is the number of minutes the client will wait before verifying the # freshness of a piece of content. CacheFilter.ExpirationMinutes=15 #########################################################################这个文件的主要功能是开启压缩和缓存功能。另外在tk-filters.zip文件的conf目录中也有这个文件，大家可以复制过来改动一下即可。
最后写一段简单的ExtJs代码来测试一下。建立一个demo.js文件，内容如下：
Ext.onReady(function(){ Ext.onReady(function(){ Ext.Msg.alert("问候", "hello, this is test page"); }); });写一个jsp文件，引入ExtJs和demo.js文件，内容如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <link rel="stylesheet" href="script/ext3/resources/css/ext-all.css" type="text/css"></link> <script type="text/javascript" src="script/ext3/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="script/ext3/ext-all.js"></script> <script type="text/javascript" src="script/demo/demo.js"></script> </head> <body> This is my JSP page. <br> </body> </html>启动服务器，用Firefox打开jsp页面，在firebug的net窗口中，可以看见ext-all.css已经有原来的135K变成了21.5K，ext-all.js文件由原来的642K变成了175.9K。
