`
j2eetop
  • 浏览: 64353 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

《开源框架那些事儿21》:巧借力与借巧力

阅读更多

同样做前端UI,为什么有人花了一点力气,就可以做好?而有的人费尽全力,仍然错误百出?我们可以先看看几个故事。

故事1:巧借力,乌鸦也可以吃核桃

有一个盛产核桃的村子,每年秋末冬初,成群的乌鸦总会来到这里,到果园里捡拾那些被果农们遗落的核桃。

核桃仁虽然美味,但是外壳那么坚硬,乌鸦怎么才能吃到呢?原来乌鸦先把核桃叼起,然后飞到高高的树枝上,再将核桃摔下去,核桃落到坚硬的地面上,被撞破了,于是,乌鸦就得到了那美味的核桃仁。

可是,让核桃从高空坠落,核桃壳破裂的概率很低,很多时候,乌鸦都是望而兴叹。然而,失败并未难倒乌鸦,不久后,它们又发明了一种更有效的方法:我们村子附近有一条环山公路,过往的车子很多。乌鸦把核桃摔在公路上,车轮很轻松地就轧碎了核桃。于是,乌鸦等车子过去后,就迅速落地,品尝美食。

顺天应人,懂得发现自身所处环境的特点,同时整合旁边的优质资源,就能使自己事半功倍,乌鸦只是把核桃带到公路上而已,就能轻松享用核桃。借力,不仅仅只局限于人与人之间,也可以向环境“借”力。

故事二:借巧力,四两拨千斤

英国大英图书馆,是世界上著名的图书馆,里面的藏书非常丰富。有一次,图书馆要搬家,也就是说从旧馆要搬到新馆去,结果一算,搬运费要几百万,根本就没有这么多钱。怎么办?有人给馆长出了个注意。

图书馆在报上登了一个广告:从即日开始,每个市民可以免费从大英图书馆借10本书。结果,许多市民蜂拥而至,没几天,就把图书馆的书借光了。书借出去了,怎么还呢?大家给我还到新馆来。就这样,图书馆借用大家的力量搬了一次家。

你肯定也想像大英图书馆那样“四两拨千斤”。如果你能发现自己的“四两之力”(图书),并且敢于把“四两之力”用出去(免费借阅),一切就都不是问题。给予,有时也是一种借力。时代发展到今天,要想成功,最快速的办法就是寻求成功者的帮助,并与对方齐心合力共同完成。完美的互援与合作永远不能被忽视。成功,不在于你能做多少事,而在于你能借多少人的力去做多少事!

许多做前端的朋友往往在这方面有诸多疑虑,在选择框架时,也会提出许多想法,比如:组件丰富些,自己不添加也足够用;2.兼容性好一点,最好IE8以上都能兼容;扩展方便点,想增加就能增加;性能能好点,界面好看点,支持更换皮肤,支持窗口小组件,,支持流式布局……

其实,这些都不是问题,也不需要你一个一个去研究透!只是,在选择适合自己的框架时,需要认真考虑一些因素:

其一,巧借力。比如,框架是否足够受欢迎、持续发展,有丰富的文档?越是受欢迎,说明使用的人越多,各种资源也就越多,可以交流的方式也就越多。被抛弃的几率越小,你可以更加安心使用该框架。好的框架需要不断更新改善,适应当前的各种技术,尤其是移动端。如果,一个框架没有在实际项目中实践,你可以随便拿来练手,但是,如果要用到专门的项目中,还是找比较成熟的框架靠谱。目前,Tiny前端框架,已经有庞大的粉丝群体,越来越受到用户的欢迎。在学习阶段,一份完善的文档可以帮助我们事半功倍。

其二,借巧力。相比一个特殊的框架,一个通用的框架可以让开发更加简单。尤其是,个性化程度如何?大多数情况下,选择最小的样式可以让定制更简便,添加新CSS比覆盖原有样式更加简单易操作且更有效率。当然,如果你还是不太确定这框架是否适合自己,你可以从不同项目中找出一两个组件放入自己的项目中。比如,TinyUI框架可以提供完整的主页面框架;提供整页切换和Ajax局部刷新的支持;提供丰富的菜单插入点;提供了多种皮肤;提供丰富的界面元素自定义;提供UI组件包的封装;提供宏封装,使用时不必关心具体实现;提供流式布局,在手机端也有良好的展现;能够解决UI组件包之间的依赖关系;能够解决CSS合并和JS合并及其压缩方面的问题……如此合成,应该也是有帮助的。

以TinyUI为例,经过多个版本的开发,目前已经基本完善。成熟的技术,活跃的团队,实际上就是在帮你巧借力、借巧力,分析一下演示地址:http://www.tinygroup.org/tinyuiweb/,可以很快找到适合自己的前端元素。如果需要进一步了解原理,还可以通过源码仓库,快速获取相关代码:http://git.oschina.net/tinyframework/TinyUiEnterprise

还是那句话,巧借力、借巧力!参与,何尝不是一种进步?

 


 欢迎访问开源技术社区:http://bbs.tinygroup.org。本例涉及的代码和框架资料,将会在社区分享。《自己动手写框架》QQ成员群:228977971,一起动手,了解开源框架的奥秘!或点击加入群:http://jq.qq.com/?_wv=1027&k=d0myfX

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics