日期:2014-03-28  浏览次数:21308 次

网页制造aiyiweb文章简介:关于CSS 框架的论述.

最近看到N多引见CSS框架,前些天我说过一句话:“在我无限的视野里,还没见到可以真正可以称得上css框架的东东~”,当然也可能是我的视野太小了,或者是说世界太大了,我本人还是感觉还有一大堆我看不到的东西。

先来看一下一个我比较认同的概念

框架可分为白盒(White-Box)与黑盒(Black-Box)两种框架。

基于承继的框架被称为白盒框架。所谓白盒即具备可视性,被承继的父类的内部实现细节对子类而言都是可知的。利用白盒框架的使用开发者通过衍生子类或重写父类的成员方法来开发系统。子类的实现很大程度上依赖于父类的实现,这种依赖性限制了重用的灵活性和完全性。但处理这种局限性的方法可以是只承继笼统父类,由于笼统类基本上不提供具体的实现。白盒框架是一个程序骨架,而用户衍生出的子类是这个骨架上的附属品。

基于对象构件组装的框架就是黑盒框架。使用开发者通过整理、组装对象来获得系统的实现。用户只须了解构件的外部接口,无须了解内部的具体实现。另外,组装比承继更为灵活,它能动态地改变,承继只是一个静态编译时的概念。

在理想情况下,任何所需的功用都可通过组装已有的构件得到,理想上可获得的构件远远不能满足需求,有时通过承继获得新的构件比利用已有构件组装新构件更容易,因此白盒和黑盒将同时使用于系统的开发中。不过白盒框架趋向于向黑盒框架发展,黑盒框架也是系统开发希望达到的理想目标。

再回头看一下如今网上那样多CSS框架(YUI是叫“YUI Library CSS Tools” 并非是“YUI CSS Frameworks”),有多少是真正以框架的概念在写,有多少只是定义款式基类的。当然,每团体对框架的理解不一定,你可能不认同我的说法。

再谈一下CSS 框架,并不非我不认可这个东西的存在,我从一两年前也就不断在尝试这样的东西。对于大型网站,前端的开发需求一个处理方案。框架自然是首选的。可惜距离我太远了,我太弱了T_T,我只需求求两点:

  • 管理下面的内容的东西
  • 类/组件

很明显,第一点,CSS做不到,第二点,绝对其它言语很弱的说。

大约在一年前做一个中型网站时,我为了偷懒,我想到内容模块化,让程序员拼页面。大约方向也就是封装了一个又一个的功用块,程序员在要用到哪一块内容时就只需使用相应的HTML与CSS,大家都方便,我不要拼页面,他不用反复套代码,大家好才是真的好。

在同一个网站,差不多的内容块,多次使用是很正常的事,这也是就让模块化成为可能,比如一个图片列表,可能是用户头像列表,或者群组的图标列表,这时你会怎样写呢?相反的用这样吗?

.photoListUesr,.photoListGroup{ /*_*/ }

这样不是说不行,但如果突然说要再加一个类似的呢?这时可能就要调整款式。而我呢?尝试过这样的使用方式:

<div class="photoList UesrCt" />
<div class="photoList GroupCt" />

这样的话,我们一开始就分离出共同表现的东西,把.photoList当成原型,通处额外的class再去处理细节。前些天,我写了 面向对象的XHTML与CSS编程 ,其实只写了一半,另一半是详细的例子,不过介于要做太多的例子跟核心曾经写出来就没写完,^^ 当然,这样也存在一定的问题,就是最后的原型的定义要很慎重,要尽量做到当前就算是改版也可能不用修正。CSS这东西,基本上一个框架最多只能适合一个站,当然,如果这个站足够大的话,这样使用才是有意义滴。

HTML与CSS越是模块化,文件越分散这个问题就越严重。HTML倒是好办,反正是使用程序最终要合并输出一份,但CSS普通会给抛弃直接使用。如果在刚才的例子中,在网页导入CSS的方式是这样的话:

@import url(/xxx/photoList.css);
@import url(/xxx/UserCt.css);
@import url(/xxx/GroupCt.css);

那甚至可以考虑用程序来拼页面,但是使用方便,请求数也成反比,普通情况大家都会选择手动合并文件。虽然人脑比电脑更智能,但很多时候,人脑的计算能力是比不上电脑滴。我曾经有这样的想法,就是使用服务端程序来处理CSS的发布机制,大约方向就是通过网站访问日志来分析出整个站各种页面的使用量,通过程序来计算哪些公共使用的要合并,合并的顺序(CSS的文件顺序会影响到优先权),等等各种计算并紧缩输出。

可惜的是,这样一套复杂的程序可能只适合一个站,或者同系列的站群。虽然说做起来有点折腾,但我置信门户级别网站使用这样的方式是有必要滴,当然前提还要整个团队都要使用相反的设计模式。

PS:以上CSS发布程序,只是我的幻想,还没尝试过,有兴味的朋友可以尝试一下,如有不测,概不担任。

当然,就以上这些还是不能称得上CSS Frameworks,或许只能叫成一个系统级处理方案,毕竟,CSS只是描述性言语。

前晚跟月影一同吃烤鸭时,有聊到这个,他问我有没有前端一体化的处理方案。JS组件化时也会面临同样的问题,差不多的发布机制应该也可以适用JS。不过完全的一体化处理方案我还没想好,也许月影多请我吃几次烤鸭我就能想好。