传统的JS压缩(删除注释,删除多余空格等)提供的压缩率有时还是不尽不意,幸亏现在的浏览器都支持压缩传输(通过设置http header的Content-Encoding=gzip),可以通过服务器的配置(如apache)为你的js提供压缩传输,或是appfuse中使用的GZipFilter使tomcat也提供这种能力

现在的问题是这种动态的压缩会导致服务器CPU占用率过高,现在我想到的解决辨法是通过提供静态压缩(就是将js预先通过gzip.exe压缩好)

一.下面描述在tomcat中的应用

1.将prototype.js通过gzip.exe压缩保存成prototype.gzjs 
2.设置header,我编写了一个简单的AddHeadersFilter来将所有以gzjs结尾的文件增加设置header Content-Encoding=gzip 
web.xml中的配置

  1. <filter>
  2. <filter-name>AddHeaderFilter</filter-name>
  3. <filter-class>
  4. badqiu.web.filter.AddHeaderFilter
  5. </filter-class>
  6. <init-param>
  7. <param-name>headers</param-name>
  8. <param-value>Content-Encoding=gzip</param-value>
  9. </init-param>
  10. </filter>
  11. <filter-mapping>
  12. <filter-name>AddHeaderFilter</filter-name>
  13. <url-pattern>*.gzjs</url-pattern>
  14. </filter-mapping>

测试prototype.js是否正常的代码

  1. <html>
  2. <head>
  3. <!-- type="text/javascript"不可少,有些浏览器缺少这个不能运行,具体已经忘记了 -->
  4. <script src="prototype.gzjs" type="text/javascript"></script>
  5. </head>
  6. <body>
  7. <input id="username" name="username" value="badqiu"/><br />
  8. <input id="email" value="badqiu@gmail.com"/>
  9. <script>
  10. <!-- 测试prototype的方法是否正常-->
  11. alert($F('username'))
  12. </script>
  13. </body>
  14. </html>

在Apache httpd中可以直接通过在httpd.conf增加AddEncoding x-gzip .gzjs来映射.gzjs文件的header

二.相关压缩率数据 
1. prototype.js 1.5.0_rc0原始大小56KB,未经任何处理直接使用gzip压缩为12KB,总压缩率79% 
2. 通过js压缩工具压缩过的protytype.js为20KB,使用gzip压缩为10KB,总压缩率为83% 
3. 实际项目中的多个js合并成的文件 439KB,直接通过gzip压缩为85KB,总压缩率81% 
4. 439KB经过js压缩为165KB,再经过gzip压缩为65KB,总压缩率86%

基本上你都可以忽略js压缩工具的压缩率,直接使用gzip压缩

gzip下载地址 http://www.gzip.org 
tomcat的压缩配置示例下载地址: http://www.blogjava.net/Files/badqiu/gziptest.rar

JavaScript的gzip静态压缩方法记录的更多相关文章

  1. 在OpenResty中使用淘宝的concat进行css和js合并，同时支持GZIP静态压缩

    =======================================================================================cd /usr/local ...

  2. linux服务器的Gzip文件压缩方法[转]

    一.gzip介绍 gzip是GNU zip的缩写,它是一个GNU自由软件的文件压缩程序,也经常用来表示gzip这种文件格式.软件的作者是Jean-loup Gailly和Mark Adler.1992 ...

  3. IIS 7 启用 gzip 静态压缩 压缩js和css文件

    搞了很久,不如nginx好弄,不知道怎么修改压缩比,也不知道怎么压缩的规则是啥(管理器上没有写),不过反正出来了,一个js文件900多K变成了100多K 1.在web.config文件里面加上: &l ...

  4. spring gzip 静态压缩优化

    HTTP 压缩可以大大提高浏览网站的速度,它的原理是,在客户端请求网页后,从服务器端将网页文件压缩,再下载到客户端,由客户端的浏览器负责解压缩并浏览.相对 于普通的浏览过程HTML ,CSS,Java ...

  5. apache启用gzip压缩方法--转载自http://www.cnblogs.com/linzhenjie/archive/2013/03/05/2943635.html

    一.gzip介绍 Gzip是一种流行的文件压缩算法,现在的应用十分广泛,尤其是在Linux平台.当应用Gzip压缩到一个纯文本文件时,效果是非常明显的,大约可以减少70%以上的文件大小.这取决于文件中 ...

  6. php简单开启gzip压缩方法(zlib.output_compression)

    网上的教程基本是你抄我来我抄他,不外乎加头加尾或者自构函数两种写法.实际上每个php页面都要去加代码——当然也可以include引用,不过总显得略微麻烦   一般而言,页面文件开启gzip压缩以后,其 ...

  7. 【09】Nginx：静态压缩 / 日志切割 / 防盗链 /恶意解析/ 跨域

    写在前面的话 上一节我们谈了关于 nginx 服务器的一些简单的安全优化问题,能够帮助我们解决一部分线上服务存在的安全隐患.但是想要提升用户体验这是原因不够的,我们还需要从服务的优化方面入手. 本节更 ...

  8. 完整的yuicompressor单个压缩和批量压缩以及gzip再次压缩，拦截器的配置等

    下载地址:http://yuilibrary.com/download/yuicompressor/ 个人认为现在yuicompressor是最安全,最值得信赖的压缩工具,至少到现在没出现过问题 1. ...

  9. Nginx 动态压缩与静态压缩，显著提高前后端分离项目响应速度！

    文章转载自:https://mp.weixin.qq.com/s/NuTmEUQU5L69is53bCauKA Nginx 中配置前端的 gzip 压缩,有两种思路: Nginx 动态压缩,静态文件还 ...

随机推荐

  1. Python中的作用域

    Python中的作用域 Python 中,一个变量的作用域总是由在代码中被赋值的地方所决定的. 当 Python 遇到一个变量的话他会按照这样的顺序进行搜索: 本地作用域(Local)→当前作用域被嵌 ...

  2. log4cplus的安装与使用初步

    1. 简单介绍 log4cplus是C++编写的开源的日志系统,The purpose of this project is to port the excellentLog for Java (lo ...

  3. 算法笔记_157:算法提高 c++_ch02_01(Java)

    目录 1 问题描述 2 解决方案   1 问题描述 编写一个程序,利用强制类型转换打印元音字母大小写10种形式的ASCII码. 输出的顺序为:大写的字母A,E,I,O,U的ASCII码,小写的字母a, ...

  4. java.lang.Void and void

    java.lang.Void is analogous to java.lang.Integer. Integer is a way of boxing values of the primitive ...

  5. 【Linux】nl命令

    用途 nl主要用于输出行号,但是与cat -n不太一样的是,可以自定义输出行号的样式 全称 nl的全称为:Number of Lines 参数 -b :指定行号指定的方式,主要有2种: -b a :表 ...

  6. MySQL中的锁、隔离等级和读场景

    一.导言 关于MySQL中的锁还有隔离等级这类话题,其概念性的解释早已泛滥.记住其概念,算不上什么.更重要的是思考:他们的区别和联系在哪儿,为什么会有这样的概念. 1)MySQL的锁(Lock)分为行 ...

  7. 利用ThreadLocal建立高质量事务处理

    ThreadLocal此类是一个以当前线程为key的map对象的构想. 当我们在web开发中,多个浏览器访问的时候,servlet为它们各开线程执行相应代码,而事务的执行依赖于特定的一个Connect ...

  8. Spark SQL and DataFrame Guide(1.4.1)——之DataFrames

    Spark SQL是处理结构化数据的Spark模块.它提供了DataFrames这样的编程抽象.同一时候也能够作为分布式SQL查询引擎使用. DataFrames DataFrame是一个带有列名的分 ...

  9. 计算机的OSI和TCP/IP网络模型

    1.计算机的网络模型分为两种OSI模型和TCP/IP模型,它们的对应关系如下:   2.针对OSI模型,每一层都有各自的功能. 应用层 应用层是OSI模型中最靠近用户的一层,负责为用户的应用程序提供网 ...

  10. atitit. java jsoup html table的读取解析 总结

    atitit. java jsoup html table的读取解析 总结 1. 两个大的parser ,,,jsoup 跟个   htmlparser 1 2. 资料比较 1 3. jsoup越佳. ...