Javascript开发之js压缩篇
Extjs可以说是目前最优秀的js开发库了。除了那个蹩脚的GPLV3授权。
但是使用中遇到的第一个问题就是，Extjs那庞大的个头。想办法压缩ExtJS的大小成了首先要解决的问题。
谈谈我的解决方法，欢迎拍砖。突然发现前面那个广告贴被锁了
1、压缩混淆
除了ExtJS的大个子以外，引用的很多其他的js库，项目中自己的js文件等等。采用OPOA组件式开发最后一定会增大js文件的总量。所以项目后期要 对这些文件进行压缩合并。现在流行的js压缩工具有很多，如packer,jsMin,Esc,JSA,yui-compressor等等。经过实际使用 我选的是yui-compressor.
yui-compressor项目地址：http://developer.yahoo.com/yui/compressor/
下载后得到一个java开发的jar包。使用方法基于命令行:
java -jar yuicompressor-x.y.z.jar [options] [input file]
开发中的js文件不可能一个个的手动压缩，这里用到了ANT。在项目构建中可以替你完成以上任务。
1. <property name="yuicompressor" value="${tools}/yuicompressor-2.3.6.jar" />
2. <apply executable="java" parallel="false" verbose="true" dest="${dist}/WebRoot">
3. <fileset dir="${dist}/WebRoot">
4. <include name="modules/*.js" />
5. <include name="js/*.js" />
6. </fileset>
7. <arg line="-jar" />
8. <arg path="${yuicompressor}" />
9. <arg line="--type js --charset UTF-8 -o" />
10. <targetfile />
11. <mapper type="glob" from="*.js" to="*-m.js" />
12. </apply>
13. <concat destfile="${dist}/WebRoot/js/base.js" encoding="UTF-8" >
14. <fileset dir="${dist}/WebRoot/js">
15. <include name="*-m.js" />
16. </fileset>
17. </concat>
18. <concat destfile="${dist}/WebRoot/modules/modules.js" encoding="UTF-8" >
19. <fileset dir="${dist}/WebRoot/modules">
20. <include name="*-m.js" />
21. </fileset>
22. </concat>
23. <delete>
24. <fileset dir="${dist}/WebRoot">
25. <include name="js/*.js"/>
26. <include name="modules/*.js"/>
27. <exclude name="modules/modules.js" />
28. <exclude name="js/base.js" />
29. </fileset>
30. </delete>
2、gzip压缩。
坛子里讨论的gzip压缩有2种，
一是有的容器（服务器）提供的功能，但这个局限于特定容器。比如apache+tomcat或者resin-pro版。
二是部署前手动gzip压缩，配合servlet过滤器使用，这个能实现gzip功能，但是降低了灵活性。
我自己用的是自己的实现，采用gzip servlet filter实现。下面是我的代码参考网上内容.
1. package sh.blog.util.web.filter;
2.
3. import java.io.IOException;
4.
5. import java.util.zip.GZIPOutputStream;
6.
7. import javax.servlet.ServletOutputStream;
8.
9. public class CompressedStream extends ServletOutputStream {
10.
11. private ServletOutputStream out;
12. private GZIPOutputStream gzip;
13.
14. /**
15. * 指定压缩缓冲流
16. * @param 输出流到压缩
17. * @throws IOException if an error occurs with the {@link GZIPOutputStream}.
18. */
19. public CompressedStream(ServletOutputStream out) throws IOException {
20. this.out = out;
21. reset();
22. }
23.
24. /** @see ServletOutputStream * */
25. public void close() throws IOException {
26. gzip.close();
27. }
28.
29. /** @see ServletOutputStream * */
30. public void flush() throws IOException {
31. gzip.flush();
32. }
33.
34. /** @see ServletOutputStream * */
35. public void write(byte[] b) throws IOException {
36. write(b, 0, b.length);
37. }
38.
39. /** @see ServletOutputStream * */
40. public void write(byte[] b, int off, int len) throws IOException {
41. gzip.write(b, off, len);
42. }
43.
44. /** @see ServletOutputStream * */
45. public void write(int b) throws IOException {
46. gzip.write(b);
47. }
48.
49. /**
50. * Resets the stream.
51. *
52. * @throws IOException if an I/O error occurs.
53. */
54. public void reset() throws IOException {
55. gzip = new GZIPOutputStream(out);
56. }
57. }
1. package sh.blog.util.web.filter;
2.
3. import java.io.IOException;
4. import java.io.PrintWriter;
5.
6. import javax.servlet.ServletOutputStream;
7.
8. import javax.servlet.http.HttpServletResponse;
9. import javax.servlet.http.HttpServletResponseWrapper;
10.
11. public class CompressionResponse extends HttpServletResponseWrapper {
12.
13. protected HttpServletResponse response;
14. private ServletOutputStream out;
15. private CompressedStream compressedOut;
16. private PrintWriter writer;
17. protected int contentLength;
18.
19. /**
20. * 创建一个新的被压缩响应给HTTP
21. *
22. * @param response the HTTP response to wrap.
23. * @throws IOException if an I/O error occurs.
24. */
25. public CompressionResponse(HttpServletResponse response) throws IOException {
26. super(response);
27. this.response = response;
28. compressedOut = new CompressedStream(response.getOutputStream());
29. }
30.
31. /**
32. * Ignore attempts to set the content length since the actual content length
33. * will be determined by the GZIP compression.
34. *
35. * @param len the content length
36. */
37. public void setContentLength(int len) {
38. contentLength = len;
39. }
40.
41. /** @see HttpServletResponse * */
42. public ServletOutputStream getOutputStream() throws IOException {
43. if (null == out) {
44. if (null != writer) {
45. throw new IllegalStateException("getWriter() has already been called on this response.");
46. }
47. out = compressedOut;
48. }
49. return out;
50. }
51.
52. /** @see HttpServletResponse * */
53. public PrintWriter getWriter() throws IOException {
54. if (null == writer) {
55. if (null != out) {
56. throw new IllegalStateException("getOutputStream() has already been called on this response.");
57. }
58. writer = new PrintWriter(compressedOut);
59. }
60. return writer;
61. }
62.
63. /** @see HttpServletResponse * */
64. public void flushBuffer() {
65. try {
66. if (writer != null) {
67. writer.flush();
68. } else if (out != null) {
69. out.flush();
70. }
71. } catch (IOException e) {
72. e.printStackTrace();
73. }
74. }
75.
76. /** @see HttpServletResponse * */
77. public void reset() {
78. super.reset();
79. try {
80. compressedOut.reset();
81. } catch (IOException e) {
82. throw new RuntimeException(e);
83. }
84. }
85.
86. /** @see HttpServletResponse * */
87. public void resetBuffer() {
88. super.resetBuffer();
89. try {
90. compressedOut.reset();
91. } catch (IOException e) {
92. throw new RuntimeException(e);
93. }
94. }
95.
96. /**
97. * Finishes writing the compressed data to the output stream. Note: this
98. * closes the underlying output stream.
99. *
100. * @throws IOException if an I/O error occurs.
101. */
102. public void close() throws IOException {
103. compressedOut.close();
104. }
105. }
1. /**
2. * 如果浏览器支持解压缩,则压缩该代码
3. * @throws IOException ServletException if an error occurs with the {@link GZIPOutputStream}.
4. * 如果需要开启该过滤器,在web.xml中加入此代码
5. <filter>
6. <filter-name>gzip</filter-name>
7. <filter-class>com.strongit.finance.gzip</filter-class>
8. </filter>
9. <filter-mapping>
10. <filter-name>gzip</filter-name>
11. <url-pattern>*.jsp</url-pattern>
12. </filter-mapping>
13. */
14.
15. package sh.blog.util.web.filter;
16.
17. import java.io.IOException;
18.
19. import java.util.Enumeration;
20.
21. import javax.servlet.Filter;
22. import javax.servlet.FilterChain;
23. import javax.servlet.FilterConfig;
24. import javax.servlet.ServletException;
25. import javax.servlet.ServletRequest;
26. import javax.servlet.ServletResponse;
27.
28. import javax.servlet.http.HttpServletRequest;
29. import javax.servlet.http.HttpServletResponse;
30.
31. import org.apache.commons.logging.Log;
32. import org.apache.commons.logging.LogFactory;
33.
34.
35. public class CompressionFilter implements Filter {
36.
37. protected Log log = LogFactory.getFactory().getInstance(this.getClass().getName());
38.
39. @SuppressWarnings("unchecked")
40. public void doFilter(ServletRequest request, ServletResponse response,
41. FilterChain chain) throws IOException, ServletException {
42.
43. boolean compress = false;
44. if (request instanceof HttpServletRequest){
45. HttpServletRequest httpRequest = (HttpServletRequest) request;
46. Enumeration headers = httpRequest.getHeaders("Accept-Encoding");
47. while (headers.hasMoreElements()){
48. String value = (String) headers.nextElement();
49. if (value.indexOf("gzip") != -1){
50. compress = true;
51. }
52. }
53. }
54.
55. if (compress){//如果浏览器支持则压缩
56. HttpServletResponse httpResponse = (HttpServletResponse) response;
57. httpResponse.addHeader("Content-Encoding", "gzip");
58. CompressionResponse compressionResponse= new CompressionResponse(httpResponse);
59. chain.doFilter(request, compressionResponse);
60. compressionResponse.close();
61. }
62. else{//如果浏览器不支持则不压缩
63. chain.doFilter(request, response);
64. }
65. }
66.
67.
68. public void init(FilterConfig config) throws ServletException {
69.
70. }
71.
72. public void destroy(){
73.
74. }
75. }
实际使用的效果以http://demo.slivercrm.cn:8084 为例