用Gzip進行js的超強壓縮
阿新 • • 發佈:2019-01-04
Gzip的官方網址為:
http://www.gnu.org/software/gzip/
Gzip的使用很簡單
解壓至某個目錄,會看到有一個Gzip.exe檔案,然後在命令視窗進入該目錄,執行
gzip ext-all.js
ext-all.js馬上變成為ext-all.js.gz
大小從原來600多k搖身一變成了160多k,簡直壓細小很多。這回下載速度就非常快了。
那麼瀏覽器能否解析這種壓縮檔案?答案是肯定的,前提是告訴瀏覽器,這種檔案需要解壓,然後再執行,解壓的過程由瀏覽器來執行。
那麼應用程式如何告訴瀏覽器,該檔案需要解壓呢,這得由伺服器通過Http的Header指令來進行。
在JOffice中,就是通過Filter來進行的。
1.把ext.all.js.gz檔名改為ext.all.gzjs,Filter等一下就會攔截這種檔案的訪問。
2.寫一個Filter,完成向Header新增指令
下面可能會用到,解決ie遇到gzjs下載問題的,沒有試驗:
compression="on" 開啟壓縮支援
noCompressionUserAgents="gozilla, traviata" 不壓縮的內容
compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain,application/json" 壓縮的型別
http://www.gnu.org/software/gzip/
Gzip的使用很簡單
解壓至某個目錄,會看到有一個Gzip.exe檔案,然後在命令視窗進入該目錄,執行
gzip ext-all.js
ext-all.js馬上變成為ext-all.js.gz
大小從原來600多k搖身一變成了160多k,簡直壓細小很多。這回下載速度就非常快了。
那麼瀏覽器能否解析這種壓縮檔案?答案是肯定的,前提是告訴瀏覽器,這種檔案需要解壓,然後再執行,解壓的過程由瀏覽器來執行。
那麼應用程式如何告訴瀏覽器,該檔案需要解壓呢,這得由伺服器通過Http的Header指令來進行。
在JOffice中,就是通過Filter來進行的。
1.把ext.all.js.gz檔名改為ext.all.gzjs,Filter等一下就會攔截這種檔案的訪問。
2.寫一個Filter,完成向Header新增指令
程式碼如下:
package com.htsoft.core.web.filter; import java.io.IOException; import java.util.HashMap; import java.util.Iterator; import java.util.Map; import javax.servlet.Filter; import javax.servlet.FilterChain; import javax.servlet.FilterConfig; import javax.servlet.ServletException; import javax.servlet.ServletRequest; import javax.servlet.ServletResponse; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class GzipJsFilter implements Filter { Map headers = new HashMap(); public void destroy() { } public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException { if(req instanceof HttpServletRequest) { doFilter((HttpServletRequest)req, (HttpServletResponse)res, chain); }else { chain.doFilter(req, res); } } public void doFilter(HttpServletRequest request, HttpServletResponse response, FilterChain chain) throws IOException, ServletException { request.setCharacterEncoding("UTF-8"); for(Iterator it = headers.entrySet().iterator();it.hasNext();) { Map.Entry entry = (Map.Entry)it.next(); response.addHeader((String)entry.getKey(),(String)entry.getValue()); } chain.doFilter(request, response); } public void init(FilterConfig config) throws ServletException { String headersStr = config.getInitParameter("headers"); String[] headers = headersStr.split(","); for(int i = 0; i < headers.length; i++) { String[] temp = headers[i].split("="); this.headers.put(temp[0].trim(), temp[1].trim()); } } } 3.在WEB.xml 檔案中,新增以下配置: <filter> <filter-name>GzipJsFilter</filter-name> <filter-class>com.htsoft.core.web.filter.GzipJsFilter</filter-class> <init-param> <param-name>headers</param-name> <param-value>Content-Encoding=gzip</param-value> </init-param> </filter> <filter-mapping> <filter-name>GzipJsFilter</filter-name> <url-pattern>*.gzjs</url-pattern> </filter-mapping> 4.在index.jsp中引入該壓縮檔案: <script type="text/javascript" src="<%=request.getContextPath()%>/ext3/ext-all.gzjs"></script>
下面可能會用到,解決ie遇到gzjs下載問題的,沒有試驗:
配置細節:<Connector port="8080" protocol="HTTP/1.1" connectionTimeout="20000" redirectPort="443" URIEncoding="UTF-8" compression="on" noCompressionUserAgents="gozilla, traviata" compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain,application/json" />
compression="on" 開啟壓縮支援
noCompressionUserAgents="gozilla, traviata" 不壓縮的內容
compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain,application/json" 壓縮的型別