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

jQuery的各种分支及如何做符合自己的前端框架

阅读更多
        话说现在已经是知识大爆炸的年代,不管你想到什么,或许都有人已经做了,所以在有任何想法前,那么请先到百度或者谷歌上搜索一下,是否有人已经实现了。那么是否别人做了,就不能再重复造轮子了呢?那也未必。前一阵子看到过一份文章,里面就有描述,如果不重复造轮子,又怎么知道什么样的轮子才是更适合的呢。

        本来打算就jQuery进行版本的精简,然后看了部分的源代码,当然论坛已经有人对源码进行了分析了!http://nuysoft.iteye.com/blog/1190542 ,此人也确实有钻研精神,里面除了对源码进行相应的解析外,还提到如何去看源码更好的方法。其打算把1.7.1看一遍重写一遍,想说的是现在已经1.7.2出来了,修复了比较多的bug及统一了事件API,一起看看谁读的比较快吧。

        好了,除了源码的熟悉外,我们看看现有的jQuery分支吧!当下比较流行的是对一些源码进行精简,那么现有哪些思路呢?1.对jQuery的源代码进行拆分,在需要的时候引入相关的js;2.对jQuery的功能进行删减,适应某些特定场景。

        基于以上两点,网上出现了jquip 和jq.Mobi 两个 jQuery分支。

        jquip号称拥有jQuery90%的常用功能,弱化一些边缘功能,毕竟边缘功能不是所有人都用得到。其核心代码大小只有6.6K,其中只有基本选择器功能,属性操作及一些工具函数。

        jquip重写了一下插件体系,使用$['plug'](meta, fn)进行扩展插件功能,其中fn接收的是$对象,即,跟jQuery所指核心相同的jQuery对象。

        jquip自己写了css插件,event插件,ajax插件,domready插件,另外同时提供了选择器的选择,在jQuery中,使用提dojo中的Sizzle的选择器,Sizzle是一个独立的选择器,那么jquip将其独立出来,除了默认的选择器外,还可以选择Sizzle或者是自己实现一个选择器!在某些特定领域,用到的选择条件较少,或许可以实现一个精简版本出来。

        jquip号称其选择器在IE6和IE7上速度可以提高8倍左右!

        当然,jquip也有其缺点,比如,需要及时跟上jQuery的改动步伐非常的困难,因为jQuery最近的更新越来越快,也因为各浏览器发版较快的原因,所以jquip需要经常跟进jQuery进行相应的改动,所以要保持跟进jQuery 90%以上的功能非常的困难,并且其中可能存在一些bug修复也要进行同步,比较麻烦。


        jqMobi走另一条路线,使用jQuery基于组合操作对象的思想,但只支持移动端的开发,将应用场景范围专注的处理移动端,其独立维护一个分支,这个分支与jQuery没有关系!当然jqMobi也会遇到与jquip相同的与jQuery版本同步的问题,但处理简单很多,jQuery很多时候处理的是浏览器间的兼容性问题,而在移动端浏览器的兼容性问题基本可忽略了,其维护成本相对较低。并且专注于移动端,jqMobi的体积非常的小,非常适合移动领域对于带宽及流量的要求。

        jqMobi包含了一个UI库,可以方便构建移动端的应用。这是一个比jquip好的地方。


        其实对比各个产品,最终目的当然不是为了造轮子,而是能在其中找出适合自己项目或者团队情况的框架需求,并造出合适的框架。
引用
        1.我们需要的是一个具有ui库的框架,以满足我们中等复杂程序的业务需求
        2.我们需要比较快速的性能,所以,在部分页面我们不需要使用全部场景时,只载入所需的js资源(需要合适的分模块,考虑到客户端缓存)
        3.需要一个比较好的插件体系,方便扩展我们的ui控件,承受一定产品需求的变化。
        4.支持PC平台上的浏览器兼容性


jQuery中的关键方法:

(function(window, undefined){
    var jQuery; // jQuery 的定义
    jQuery.fn = jQuery.prototype; // jQuery.fn的定义,定义jQuery的原型所有的扩展都是通过extend方法扩展在jQuery.fn上
    jQuery.extend;  //通过extend方法扩展工具方法:each,trim,nodeName,isEmptyObject等等
})(window);

jQuery通过extend的扩展:
引用
Callbacks插件(目前只应用于ready方法回调)
Deferred的缓迟加载
cache缓存
queue请求队列处理
attr属性操作
event事件操作
Sizzle CSS Selector Engine 选择器
find,has,filter等过滤方法
text,wrapAll等html操作方法
css,style样式操作
ajax操作
animate动画效果

那么jQuery的走向即是将这些模块独立出来,作为插件扩展式的方向发展。
接下来,将会分析每个功能点的重点性及必要性,然后对其中的功能点进行取舍。
Callbacks插件 


分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics