为什么要开发CKStyle? #30

Closed
wangjeaf opened this Issue Sep 25, 2014 · 1 comment

Comments

Projects
None yet
2 participants
@wangjeaf
Owner

wangjeaf commented Sep 25, 2014

为什么要开发CKStyle

CKStyle出生的文章,发表于两年前,具体文章内容,请参见这里

下面,我们来简单回顾下。

业内CSS工具方面的问题

1. CSS代码风格检查工具缺失

任何CSS编码规范,都会长篇大论的说明CSS的编码风格约束,可是,目前并没有一款工具,能够像JSLint/JSHint那样,检查CSS的代码风格问题。

2. CSS代码取值的检查不尽如人意

CSSLint能够对CSS做一些检查,但是远远不够。详见 CKStyle出生记

3. CSS相关工具各自为政,五花八门,不利于整合

当年,

  • YUICompressor(压缩)用Java开发
  • CSSComb(美化)用php开发
  • CSSLint(检查)用Nodejs开发

虽然现在,Nodejs的工具有统一所有工具的趋势,但大多数还是各自为政,比如:

  • clean-css(压缩)用Nodejs开发,自己开发解析器,只用于在Nodejs下压缩
  • cssmin(压缩)是YUICompressor的Nodejs版本,也只是用于压缩

其他工具,或许也已经有了Nodejs的版本,但是问题依旧。

每一个工具,都用自己的解析器,为自己的某一个单项的功能服务。

4. 没有满足要求的解析器

解析器五花八门,但是都没有满足以下要求:

  • 没有一个解析器给出了清晰的语法树结构,所有解析器,都是不明觉厉
  • 没有一个解析器完整的保留了代码的原始信息(空格,回车等),无法检查风格问题

因此,我们才需要自己写一个解析器。

CKStyle:CSS工具的统一

CSS的语法树,应该遵循一种StyleSheet -> RuleSet -> Rule的简单树结构,针对这个结构,我们可以做很多的事情:

  • 遍历树结构,用插件,找寻代码问题,即为 检查
  • 遍历树结构,用插件,修改语法树属性并最终导出,即为 修复
  • 遍历树结构,顺序按照结构输出,即为 美化
  • 遍历树结构,顺序简单输出,即为 压缩
  • 遍历树结构,对每一个属性,根据浏览器兼容性,挑选出来,再顺序输出,即为 分浏览器压缩

只要有了语法树结构,CSS相关的任何事情,都应该显得非常的自然

CKStyle的优势

  • 更高的压缩率(在线编辑提供证据 http://ckstyle.github.io/
  • 更完备的功能(检查、修复、美化、压缩,一气呵成)
  • 更强的扩展性(插件式)
  • 更新颖的使用方式(CKService)
  • 更多运行环境的支持(浏览器、命令行、Nodejs环境)
  • 对开发者,更开放,更自由(规则是插件,命令行工具也是插件,均可热插拔)

CKStyle的未来

目前,CKStyle已经覆盖了大多数常见的CSS写法,但是CSS是灵活多变的,我们需要更多的插件、更多的测试,来让CKStyle的功能更强大,更完备,更准确

未来,我们希望,通过简单的语法树结构,让更多的人,能够快速的开发规则插件和命令行插件,扩展CKStyle的功能。

@wangjeaf wangjeaf added the doc label Sep 25, 2014

@wangjeaf wangjeaf closed this Sep 28, 2014

@jacktan1991

This comment has been minimized.

Show comment
Hide comment
@jacktan1991

jacktan1991 Sep 12, 2015

好工具!!顶。不过想问下CKStyle和其他工具如grunt/glup或者是ide的集成情况

好工具!!顶。不过想问下CKStyle和其他工具如grunt/glup或者是ide的集成情况

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment