`

GZip压缩和按需装载提升Ext Js的性能

阅读更多
ext-all.js这个文件都有500多k,在页面中直接引用这个js文件是很不现实的,曾经在一个大的项目中使用这个js,则直接导致页面半天出不来的后果。于是自己研究了下,目前通过下面的方法来优化提升Ext Js的性能(转载请注明出处 http://blog.csdn.net/selley ):
  • 使用JSVM、

        JSVM (JavaScript Virtual Machine的缩写),一个JavaScript基础框架,sourceforge开源项目,由万常华(wch3116)于2003年底发起, 目前最新版本是2.05,采用的是 BSD License 授权协议。本身JSVM也提供了JSVM+Ext2的实例,看看就知道怎么在JSVM下加入ext的js库了。

       (不知道为什么jsvm官网上不去了)

      我在项目中是这么用的:

  1. <script type= "text/javascript" src= "/depporject/comjs/jsvm2/jsre.js" classpath= "dom2.gzjs;ext2p.gzjs" modules= "smartloader" ></script>

为什么扩展名是gzjs呢,这是使用了gzip压缩js文件(转载请注明出处 http://blog.csdn.net/selley );

  • 使用Gzip压缩

     gzip压缩后,ext js文件的大小将只有100k左右。(转载请注明出处 http://blog.csdn.net/selley )

    只是对gzip压缩的文件需要提供filter(Java开发),为你的应用提高解压缩功能,filter的写法很简单:

  1. ............
  2.     public void doFilter(HttpServletRequest request,
  3.              HttpServletResponse response, FilterChain chain)
  4.              throws IOException, ServletException {
  5.              for (Iterator it = headers.entrySet().iterator();it.hasNext();) {
  6.                  Map.Entry entry = (Map.Entry)it.next();
  7.                  response.addHeader((String)entry.getKey(),(String)entry.getValue());
  8.                //转载请注明出处 http://blog.csdn.net/selley
  9.              }
  10.              chain.doFilter(request, response);
  11.      }
  12.      public void init(FilterConfig config) throws ServletException {
  13.          String headersStr = config.getInitParameter( "headers" );
  14.          String[] headers = headersStr.split( "," );
  15.          for ( int i = 0 ; i < headers.length; i++) {
  16.              String[] temp = headers[i].split( "=" );
  17.              this .headers.put(temp[ 0 ].trim(), temp[ 1 ].trim());
  18.          }
  19.      }
  20. }
  1. web.xml配置(转载请注明出处 http://blog.csdn.net/selley ):
  2. < filter >
  3.          < filter-name > addHeaderFilter </ filter-name >
  4.          < filter-class >org .common.AddHeaderFilter </ filter-class >
  5.          < init-param >
  6.              < param-name > headers </ param-name >
  7.              < param-value > Content-Encoding = gzip </ param-value >
  8.          </ init-param >
  9.      </ filter >
  10.     
  11.     
  12. 通过以上两步,整个页面装载速度很快了。大家可以试试。

另外在实际开发中,并不是将ext-all.js全部在jsvm中装载,只是将常用的ext js代码归到一起,由gzip压缩,然后又jsvm装载(即ext2p.js,p代表部分),剩下的ext js代码由jsvm按需装载。

 

以上是抄袭网络上的,但是按照上面还有问题的,tk-filters.jar这个包现在 最新版本是要加资源文件的,对文件是否压缩要在里面配置GZIPFilter.Enabled=true这个要设置打开,否则无效,不加资源文件也是无效 的,测试的时候最好在js下面加上参数m=?<%=System.currentTimeMillis()%>这样每次都是让浏览器获取新 的,可以用工具查看是否进行压缩了,其实只要配置里面设置了GZIPFilter.LogStats=true后台是有提示压缩比例的~

分享到:
评论

相关推荐

    利用JAVASCRIPT即你想那个GZIP压缩与解压缩

    标题中的“利用JAVASCRIPT实现GZIP压缩与解压缩”指的是在JavaScript环境中,我们可以使用原生或第三方库来处理GZIP格式的压缩和解压缩操作。GZIP是一种广泛使用的数据压缩格式,常用于减少网络传输的数据量,尤其是...

    gzip压缩js,csss文件

    在IT行业中,优化网站性能是至关重要的,其中一种方法就是对JavaScript(js)和CSS(css)文件进行压缩。本文将详细讲解如何使用gzip工具来压缩这两种文件,以减少网络传输的数据量,从而提高网页加载速度。 gzip是...

    js压缩gzip格式

    JavaScript(JS)是一种...总之,js压缩成gzip格式是提高网页性能的重要手段,通过合理利用gzip,可以有效减少网络传输的数据量,提升用户体验。正确配置和使用gzip不仅能优化前端性能,也有利于节省服务器带宽资源。

    pako gzip 压缩和解压缩(支持中文)

    pako是一个高效的JavaScript库,提供了对多种压缩算法的支持,包括gzip。在本项目中,我们将关注如何使用pako库进行gzip压缩和解压缩,并解决在处理中英文内容时可能出现的乱码问题。 首先,让我们详细了解pako库。...

    IIS启用GZIP压缩js、css无效的原因及解决方法.docx

    本文主要探讨的是在IIS服务器上启用GZIP压缩针对JavaScript(js)和CSS文件无效的问题及其解决方案。 IIS(Internet Information Services)是微软提供的一个Web服务器,支持多种功能,包括GZIP压缩。当用户发现IIS...

    ajax+pako.js实现gzip数据压缩上传,解决post数据过长问题

    6. **安全性和性能考虑**:虽然gzip压缩可以显著减少数据传输量,但也增加了计算资源的消耗。因此,对于非常大的数据集,可能需要权衡压缩带来的益处和额外的计算成本。同时,需要注意安全问题,确保数据在压缩和...

    php gzip 压缩js或css

    请注意,虽然`Gzip`压缩可以显著提升加载速度,但过度压缩可能会增加服务器负担,因此需要权衡性能和服务器负载。此外,对于已经进行了其他压缩(如minify)的文件,再次使用`Gzip`压缩可能效果不明显,因为这些文件...

    关于Gzip压缩js文件提高网站运行速度

    2. **缓存利用**:确保浏览器能够正确缓存Gzip压缩的文件,以避免不必要的重复压缩和传输。 3. **测试与监控**:定期检查网站性能,确保Gzip正确启用且无任何副作用,比如兼容性问题。 通过以上介绍,我们可以了解...

    gzip.rar_C gzip源码_c语言gzip_gzip压缩_gzip解压_poetryfem

    3. 添加文件头和尾部信息:gzip格式的文件在压缩数据前有一个包含文件名、时间戳和其他元数据的头部,而在数据后有一个校验和字段,用于验证解压缩后数据的完整性。 4. 写入输出文件:将压缩后的数据以及头尾部信息...

    apache开启gzip压缩网络传输减少带宽

    Gzip 压缩在 Web 服务器中广泛应用,因为它可以减少服务器的带宽成本和提高页面加载速度。 为什么需要开启 Gzip 压缩? 开启 Gzip 压缩可以带来以下几个好处: * 减少网络传输的带宽:Gzip 压缩可以将数据压缩到...

    Net的Gzip压缩类 compressionmodule ,解决js中文压缩问题

    此外,对于小文件,压缩和解压的时间可能比直接传输未压缩文件所需的时间还要长,此时可能不推荐启用压缩。 总的来说,`compressionmodule`是ASP.NET中一个强大的工具,它简化了HTTP压缩的实现,使得开发者能够轻松...

    最简单的gzip压缩

    gzip是一种基于DEFLATE算法的压缩格式,它结合了LZ77的无损数据压缩和霍夫曼编码。这个压缩过程可以将文本文件尤其是HTML、CSS和JavaScript文件的大小显著减小,从而减少网络带宽的使用。在Linux和Unix系统中,gzip...

    pako gzip 压缩和解压缩(支持中文).rar

    pako是一个高性能的JavaScript库,它实现了多种压缩和解压缩算法,包括gzip。本项目着重介绍了如何使用pako库处理gzip压缩和解压缩,并且解决了中文字符在处理过程中的乱码问题。 gzip是一种广泛使用的数据压缩格式...

    22、MapReduce使用Gzip压缩、Snappy压缩和Lzo压缩算法写文件和读取相应的文件

    在大数据处理领域,...同时,了解各种压缩算法的特点和性能,对于优化Hadoop集群的性能和资源利用率至关重要。在实际操作中,应根据具体的数据特性和业务需求,进行适当的测试和调优,以找到最适合的压缩策略。

    gzip 压缩 三种方法

    - **文件大小阈值**:对于非常小的文件,压缩可能并不能带来显著的优化,甚至可能因额外的压缩和解压过程而降低效率。因此,可以根据文件大小设定启用gzip的条件。 总结,gzip压缩在PHP环境中通过服务器配置和代码...

    启用 IHS GZip 压缩提高网络 IO 性能

    总的来说,启用 IHS 的 GZip 压缩能够提升网站性能,降低服务器负载,改善用户体验。然而,需要注意的是,过度的压缩可能会增加服务器的 CPU 使用率,因此需要根据实际情况调整压缩级别和选择要压缩的文件类型。同时...

    nginx-1.18.0已开启gzip压缩优化vue项目大小.zip

    在现代Web开发中,优化前端项目以提高加载...Nginx的gzip压缩和Vue CLI的打包过程都是为了提高网站的加载速度,提升用户体验。通过了解这些技术细节,开发者可以更好地优化自己的Web应用,使其在性能上达到最佳状态。

    C语言编写的GZIP压缩算法(含工程文件,附带测试程序)

    C语言编写的GZIP压缩算法是一项基础而重要的技术,它涉及到数据压缩、文件处理和程序设计等多个领域。GZIP是一种广泛使用的数据压缩格式,由GNU项目开发,主要用于减少文件大小,便于存储和传输。在本项目中,我们有...

    gzip源码,gzip压缩算法

    在深入探讨gzip源码和其压缩算法之前,首先需要理解GZIP是什么。GZIP是一种广泛使用的数据压缩格式,主要用于文件传输和存储。它基于DEFLATE算法,该算法结合了LZ77(一种字典压缩方法)和霍夫曼编码(一种熵编码...

    前端gzip 解压缩pako.min.js文件

    总之,前端使用`pako.min.js`库可以方便地处理GZIP压缩的数据,它提供了一种高效、轻量级的解决方案,帮助开发者优化资源加载,提升网站性能。在实际开发中,应结合其他优化手段,如HTTP2、服务端渲染、代码分割等,...

Global site tag (gtag.js) - Google Analytics