前端性能优化之Html压缩 -- JavaScript -- IT技术博客大学习 -- 共学习共进步！

您现在的位置：首页 --> JavaScript --> 前端性能优化之Html压缩

前端性能优化之Html压缩

浏览:3811次出处信息

下载试用：Uedsky HtmlCompressor（应该至少需要 .net 2.0才能运行）
程序版本：1.0.0.0

1.前言

写这个小工具是因为我的首页要用，看到很多地方（baidu,google等首页）提到Html压缩，但是好像没有见过哪里有工具可以下载，所以就想到自己写，一般情况下情况下只用压缩首页，或者生成静态页后可以压缩，就这个小工具来说，我写正则也没有考虑到效率（css部分参考yui compressor只顾到了程序可读性）(认为Html不需要压缩的飘过)。

2.压缩比率

个人觉得Html文件还是有必要压缩的，使用这个小工具Cnblogs的首页可以压缩18%，我的首页也可以压缩15%;

3.特点：无损压缩

由于 pre,textarea中的换行等内容会直接显示，所以不对其压缩，script标签由于js压缩比较复杂这里就不处理，如果内联javascript文件比较多，请先使用yui compressor压缩后放到页面里，压缩style标签里的css(核心参照yui compressor的源码)，程序执行步骤如下：

1.正则(?is)<!-(?![if).*?-->匹配注释，将所有html注释去掉，这里排除右边为[if的，防止将ie条件注释压缩掉

2.然后(?is)<(pre|script|style|textarea)[^>]*>.*?，将这些标签里内容提出来保存，防止替换时出错

3.将html标签之间的空白去掉：(?<=<[^>]+>)s+(?=<[^>]+>)

4.去掉所有的换行：[rn]+

5. 然后执行一个可选项：是否将多个空白换成一个，在Html中多个空白会解析成一个，所以默认为true

6.然后恢复保存的pre等标签内容

7.执行css压缩（步骤比较多就不列出来了，可以看yui compressor的源码）（这个也是可选项，如果没有内联的css或者是已经压缩过可以不选）

来源：http://www.cnblogs.com/sohighthesky/archive/2010/05/14/uedsky-html-compressor.html

http://www.blogjava.net/BearRui/archive/2010/05/16/html_compressor.html