压缩前端⽂件（html,css,js）
1：原因
在写前端代码时, 因为要尽可能的适合阅读会加⼊许多注释, 空格等, 这些在开发时是必要的, 但当你要发布时, 就需要让代码更加精简, 精简压缩的同时也混淆了代码, 安全性也加强了, 可以说是⼀举两得。
2：解决⽅案
使⽤ htmlcompressor-1.5.3.jar(html) 和 yuicompressor-2.4.8.jar(js, css) 实现前端资源的压缩。
3：例⼦
3.1 htmlcompressor-1.5.3.jar 压缩 html⽂件
java -jar ./htmlcompressor-1.5.3.jar Internet.html -o Internet1.html (表⽰压缩Internet.html⽂件中的html代码)
如果, html⽂件中嵌⼊了css, 和js代码呢？这就需要添加 --compress-js 和 --compress-css 这两个选项来实现压缩
java -jar ./htmlcompressor-1.5.3.jar Internet.html -o Internet1.html --compress-js  --compress-css  (表⽰压缩Internet.html⽂件中所有代码, 压缩后⽂件更⼩)
压缩后⼤⼩对⽐(⼩了59kb):
[stone web]$ ls -l Internet.html
-rw-rw-r-- 1 stone stone 205671 Nov 1510:39 Internet.html
[stone web]$ ls -l Internet1.html
-rw-rw-r-- 1 stone stone 145151 Nov 1510:51 Internet1.html
内容对⽐图(右边被压缩后的html⽂件更加紧凑, 却不影响浏览器识别):
  htmlcompressor-1.5.3.jar 也可以压缩js和css⽂件, 就是使⽤'--compress-js 和 --compress-css这两个选项', 但是使⽤htmlcompressor-
1.5.3.jar压缩的css和js还不够彻底, 可以使⽤专门压缩css和js⽂件的⼯具yuicompressor-
2.4.8.jar
3.2 yuicompressor-2.
css和html和js怎么结合4.8.jar 压缩 js 和css⽂件
命令: java -jar ./yuicompressor-2.4.8.jar ./js/AES.js -o test.js
压缩后⼤⼩对⽐(5kb):
[stone web]$ ls -l ./js/AES.js
-rw-rw-r-- 1 stone stone 9173 Nov 1510:39 ./js/AES.js
[stone web]$ ls -l ./test.js
-rw-rw-r-- 1 stone stone 4057 Nov 1510:58 ./test.js
内容对⽐图(右边被压缩后的js⽂件更加紧凑, 却不影响浏览器识别):
⽽且可以看到, js⽂件的内容被压缩到了⼀⾏上⾯, 并且yuicompressor还将js⽂件中的变量⽤a,b,c等来替代, 所以压缩程度是⽐较⾼了的, 所以对⼈来说很不友好, 但是不影响机器识别功能。
4：使⽤到我的平台
在项⽬中, 直接在⽣成image之前, 将拷贝到⽂件系统(rootfs)中的所有html, js, css进⾏压缩之后再编译FW即可.
参考的Makefile:
#find $(TARGET)/htdocs/web/ -type f -name *.html -exec java -jar $(TOPDIR)/progs.brand/java/htmlcompressor-1.5.3.jar  {}  -o {} --compress-js --compress-css \;
#find $(TARGET)/htdocs/web/js ! -path "*/localization/*" -type f -name *.js ! -name MacList.js -exec java -jar $(TOPDIR)/progs.brand/java/yuicompressor-2.4.8.jar {} -o {} \;    #find $(TARGET)/htdocs/web/css -type f -name *.css -exec java -jar $(TOPDIR)/progs.brand/java/yuicompressor-2.4.8.jar {} -o {} \;
经过对⽐, FW⽐没有压缩前端code⼩了1M左右