Javascript壓縮，都是採用刪除註釋,刪除多餘空格,替換字符等方式進行的，還有一種通過服務器的配置來實現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中的配置
引用內容
<filter>
<filter-name>AddHeaderFilter</filter-name>
<filter-class>
badqiu.web.filter.AddHeaderFilter
</filter-class>
<init-param>
<param-name>headers</param-name>
<param-value>Content-Encoding=gzip</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>AddHeaderFilter</filter-name>
<url-pattern>*.gzjs</url-pattern>
</filter-mapping>
<filter-name>AddHeaderFilter</filter-name>
<filter-class>
badqiu.web.filter.AddHeaderFilter
</filter-class>
<init-param>
<param-name>headers</param-name>
<param-value>Content-Encoding=gzip</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>AddHeaderFilter</filter-name>
<url-pattern>*.gzjs</url-pattern>
</filter-mapping>
3.測試prototype.js是否正常的代碼
程序代碼
<html>
<head>
<!-- type="text/javascript"不可少,有的瀏覽器缺少這個不能運行 -->
<script src="prototype.gzjs" type="text/javascript"></script>
</head>
<body>
<input id="username" name="username" value="badqiu"/><br />
<input id="email" value="[email protected]"/>
<script>
<!-- 測試prototype的方法是否正常-->
alert($F('username'))
</script>
</body>
</html>
<head>
<!-- type="text/javascript"不可少,有的瀏覽器缺少這個不能運行 -->
<script src="prototype.gzjs" type="text/javascript"></script>
</head>
<body>
<input id="username" name="username" value="badqiu"/><br />
<input id="email" value="[email protected]"/>
<script>
<!-- 測試prototype的方法是否正常-->
alert($F('username'))
</script>
</body>
</html>
二.相關壓縮率數據
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 compressed,Js壓縮,javascript壓縮,js壓縮工具,js壓縮合並,js文件壓縮