關于JavaScript的gzip靜態壓縮方法
2024-09-06 12:43:58
供稿：網友
一個頁面減少10KB對于一個小網站來說，算不上什么，但對于大型站點來說，累計起來卻是一個很大的流量......gzip壓縮是一個有效可行的方法，但需要Apache的支持(Apache與IIS共用一個端口解決方法)。
傳統的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> 測試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="badqiu@gmail.com"/>
<script>
<!-- 測試prototype的方法是否正常-->
