web页面加载性能优化之~gzip

web页面加载性能优化之~gzip

    web项目页面加载性能优化可以通过开启服务端的gzip功能来实现，目前大部分客户端浏览器request内置 content-encoding:gzip 属性，如果没有可以在request中配  置加上。

    服务器端tomcat 和weblogic 配置方式分别如下:

     1. tomcat服务器在server.xml 中加入配置参数

              <Connector port="80" protocol="HTTP/1.1"  connectionTimeout="20000"   redirectPort="8443" executor="tomcatThreadPool" URIEncoding="utf-8"
              compression="on"  compressionMinSize="50" noCompressionUserAgents="gozilla, traviata"

              compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain" />

    从上面节点的属性可以看出，要使用gzip压缩功能，你需要在Connector节点中加上如下属性
            compression="on" 打开压缩功能
            compressionMinSize="50" 启用压缩的输出内容大小，默认为2KB
            noCompressionUserAgents="gozilla, traviata" 对于以下的浏览器，不启用压缩
            compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain"　哪些资源类型需要压缩测试方法  

     2.weblogic 服务器配置如下：

    一、首先,去http://sourceforge.net/projects/filterlib网站下载tk-filters-1.0.1.zip。
    二、解压这个tk-filters-1.0.1.zip压缩文件，将解压后的文件tk-filters.jar放在Ext项目的WEB-INF/lib/下。
    三、打开解压后的文件夹tk-filters\conf\tk-filters.properties
    GZIPFilter.Enabled=false(默认为false,true打开GZIP压缩功能)
    GZIPFilter.LogStats=false(默认为false,true打开GZIP压缩功能日志,可以在后台看到压缩比例信息)
    CacheFilter.Enabled=false(默认为false,true打开GZIP缓存功能)
    注:可以自行选择想打开的功能,再将此文件复制到Ext项目的WEB-INF/class文件夹下（我这边eclipse3.5是WEB-INF/classes下面）

  

   四、打开Ext项目的WEB-INF/web.xml文件 加入如下配置：

  <!-- GZIPFilter压缩定义 设置此项时tk-filters.properties的GZIPFilter.Enabled=true才可用-->
  <filter>
    <filter-name>GZIPFilter</filter-name>
    <filter-class>com.tacitknowledge.filters.gzipfilter.GZIPFilter</filter-class>
  </filter>
  <!-- GZIPFilter 设置自己想要压缩的文件类型-->  
  <filter-mapping>
    <filter-name>GZIPFilter</filter-name>
    <url-pattern>*.js</url-pattern>
  </filter-mapping>
  <filter-mapping>
    <filter-name>GZIPFilter</filter-name>
    <url-pattern>*.jsp</url-pattern>
  </filter-mapping>
  <!-- CacheFilter缓存定义 设置此项时tk-filters.properties的CacheFilter.Enabled=true才可用 -->
  <filter>
    <filter-name>CacheFilter</filter-name>
    <filter-class>com.tacitknowledge.filters.cache.CacheHeaderFilter</filter-class>
  </filter>
  <!-- CacheFilter 设置自己想要缓存的文件类型-->
  <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>
  <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>

测试方法

  启用了这个压缩功能后，我们如何来测试压缩是否有效呢？

 首先Tomcat是根据浏览器请求头中的accept-encoding来判断浏览器是否支持压缩功能，如果这个值包含有gzip，就表明浏览器支持gzip压缩内容的浏览， 然后我们可 以在响应头里面看看content-encoding：gzip以及对比使用gzip 属性前后文件的大小