有没有任何积极的CSS缩小工具?

我想知道是否有人知道一个工具,将积极重写CSS来更有效地压缩样式。 我想:

.foo { color : red; font-size: 16px; height: 20px; } .bar { color : red; font-size: 16px; height: 30px; } 

被压缩到:

 .foo, .bar { color : red; font-size : 16px; } .foo { height : 20px; } .bar { height : 30px; } 

为了清楚起见,我所知道的所有缩小器,例如YUI Compressor,只删除空格,并且可能会join一些属性(如font-familyfont-sizefont )。 我正在寻找一些愿意完整地重写文件结构的东西。

简而言之,如果有人知道任何人的工作背后的压缩逻辑,这个信息将不胜感激。 如果找不到我想写的东西,但是还有一百万的东西需要考虑,比如页margin-topmargin ,select器特殊性和包含顺序等等等等。如何有效地压缩信息,如重复select器或属性会更有效率?

       

网上收集的解决方案 "有没有任何积极的CSS缩小工具?"

我不知道任何积极的CSS缩小工具,但可以使用以下方法:

build立

  1. 展开你的CSS( margin:1px 0 0 0; margin-top:1px; margin-left:0px; …)。
  2. build立一个图G =(V,E),其中V为顶点集合,E为边集合:
    • V由两个集合A(唯一select器,例如divp > span#myid )和B(唯一属性,例如display:block; color:#deadbeef; )组成。
    • E由select器(在A中)和属性(在B中)之间的所有关联组成。
  3. b的元素使用适当的权重函数c 。 这可能是给定元素b的邻居数量,或accumulated lenght of properties - accumulated length of selectors 。 你的select。

你可能会注意到,通过使用这种方法,你会得到一个二分图。 现在尝试下面的贪婪algorithm(伪代码):

algorithm

  1. B中具有最大权重的元素b并将其添加到空集Z中
  2. 检查B中的另一个元素d是否具有相同的权重
    • 如果存在这样的广告,检查它是否覆盖相同的select器。
      1. 如果d覆盖相同的select器:将d添加到Z并转到步骤2。
      2. 如果d没有覆盖相同的select器,则检查具有相同权重的下一个元素,或者如果检查了所有元素,则转到步骤3。
  3. 现在Z是一组包含一些select器的属性。 将其parsing为一个缓冲区。
  4. 删除Z中的所有元素及其在G中的相邻边,并删除Z本身。
  5. 如果B不为空,请转到步骤1。
  6. 您的缓冲区包含一个预缩小的CSS代码。 你现在可以合并一些属性(例如margin-top:0px;margin-left:1px )。

备注

请注意,实际压缩取决于你的体重function。 由于这是一个贪婪的algorithm,它可能会返回一个缩小的CSS,但我相信有人会发表一个反例。 还要注意,你必须在删除Z中的元素后更新你的权重函数。

运行时估计

如果我没有弄错的话,algorithm总是会终止并运行在O( |B|^2*|A| )。 如果您使用堆并对每个邻接列表(设置时间O( |B|*|A|log(|A|) ))中的属性进行sorting,您将得到O( |B|*|A|* (log(|B|)+log(|A|)) )。

CSS Tidy就像一个冠军!

  • 像“黑色”或rgb(0,0,0)这样的颜色,如果可能的话,会被转换成#000000或#000。
  • 如果一些hex代码较短,则用它们的颜色名称replace它们。
  • {property:x; property:y;}成为{property:y;}
  • (所有重复的属性被合并)margin:1px 1px 1px 1px; 成为保证金:1px;
  • 保证金:0像素; 变成保证金:0;
  • 一个{边距:10px的; 边距:10px的; 保证金左:10px的; margin-right:10px;}变成
  • 一个{余量:10px的;}
  • 保证金:010.0px; 成为保证金:10px;
  • 所有不必要的空白被删除
  • 取决于压缩级别,所有的背景属性被合并
  • 所有评论被删除
  • 每个块中的最后一个分号可以被删除
  • 缺less分号被添加
  • string中不正确的换行符是固定的
  • 缺less的单位被添加
  • 不好的颜色(和颜色名称)是固定的
  • 适当的价值 ! 重要; 成为财产:价值!重要;

你见过YUI压缩机吗?

一个名为CSS Tools的项目声称要这样做。