`
haiyupeter
  • 浏览: 426139 次
  • 性别: 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插件 


分享到:
评论

相关推荐

    HTML+CSS+JavaScript+jQuery+Bootstrap等前端框架实现的前端案例.zip

    在本压缩包“HTML+CSS+JavaScript+jQuery+Bootstrap等前端框架实现的前端案例.zip”中,包含了多个基于Web前端技术实现的实例项目。这些项目主要用于展示如何利用HTML、CSS、JavaScript、jQuery以及Bootstrap等常见...

    前端开发框架

    ### 主流前端框架简介 #### jQuery 作为最早流行起来的JavaScript库之一,jQuery简化了许多常见的操作,比如DOM操作、事件处理、AJAX请求等。尽管现在有很多更新、更强大的框架,但jQuery仍然在很多项目中占有重要...

    前端框架利器——bootstrap

    ### 前端框架利器——Bootstrap深度解析 在前端开发领域,**Bootstrap**无疑是一颗璀璨的明星,它以其简洁直观、功能强大的特性迅速成为众多开发者手中的利器。本文旨在深入探讨Bootstrap的核心价值及其在现代Web...

    Foundation目前世界上最先进的前端响应式框架

    综上所述,Foundation是一个强大的前端框架,结合了现代Web技术,提供了全方位的工具和资源,以帮助开发者构建响应式、跨平台的Web应用。无论是快速原型设计还是复杂应用开发,Foundation都是一个值得考虑的优秀选择...

    JQuery EasyUi Demo框架源码

    JQuery EasyUI 是一款基于JQuery库的前端框架,它为开发者提供了丰富的UI组件和强大的交互功能,使得构建具有专业外观和用户体验的Web应用变得轻而易举。在"JQuery EasyUI Demo框架源码"中,我们可以深入探究EasyUI...

    前端项目-jquery-infinitescroll.zip

    此外,还可以与其他jQuery插件或前端框架(如Bootstrap)结合使用,以实现更复杂的功能和视觉效果。 总的来说,【前端项目-jquery-infinitescroll.zip】为前端开发者提供了一个高效、易用的工具,帮助他们在网站中...

    前端项目-protonet-jquery.inview.zip

    【标题】"前端项目-protonet-jquery.inview.zip"涉及的是一个前端开发中的JavaScript库,具体来说是一个基于jQuery的插件,名为"jquery.inview"。这个插件主要用于检测DOM(文档对象模型)元素是否在用户的视口范围...

    前端开源库-jquery-widget-compiler

    总的来说,【前端开源库-jquery-widget-compiler】是前端开发中提升效率和代码质量的一个利器,尤其适合那些习惯于jQuery生态的开发者。通过利用此工具,开发者可以更高效地创建出功能丰富、易于维护的jQuery小部件...

    前端项目-opal-jquery.zip

    在当今的Web开发领域,前端框架扮演着至关重要的角色,它们能够帮助开发者快速构建交互性强、用户体验良好的网页应用。本项目“前端项目-opal-jquery”正是一个这样的实例,它将Ruby的Opal库与JavaScript的jQuery...

    非常适合新手的网页版幸运转盘项目!后端:Flask,前端:Bootstrap+Jquery.zip

    这是一个适合初学者的网页版幸运转盘项目,它结合了后端技术和前端框架,帮助学习者快速理解Web应用开发的基本流程。项目的核心是使用Python的轻量级Web框架Flask作为后端,以及Bootstrap和jQuery作为前端技术。下面...

    基于ssh的公司人员信息管理系统:前端 html、jquery,后端 springmvc、hibernate.zip

    标题中的“基于ssh的公司人员信息管理系统”指的是一个利用SSH...它利用SSH框架实现了后端服务,使用jQuery增强前端交互,并可能运用了AI算法进行数据分析。整个系统经过了严谨的分析和设计,确保满足企业的实际需求。

    jquery网站发展历史时间轴

    **jQuery 网站发展历史时间轴** ...至今,尽管现代前端框架如React、Vue和Angular已经占据主导地位,但jQuery依然是许多项目中的重要组成部分,尤其在维护旧有项目时,其简洁和强大的特性仍然无可替代。

    jQuery中ajax请求后台返回json数据并渲染HTML的方法

    jQuery中的AJAX请求是一种非常常见的前端异步数据交互方式,它的作用是使得页面无需重新加载即可向服务器请求数据,并将数据动态地加载到页面中。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它...

    Bootstrap简洁直观强悍移动设备优先的前端开发框架

    总的来说,Bootstrap作为一款强大的前端框架,极大地提升了Web开发的效率和质量,无论你是初学者还是经验丰富的开发者,都可以借助它快速构建出高质量的网页项目。其响应式设计、丰富的组件和便捷的JavaScript插件,...

    一款前端web模板

    本文将深入探讨“一款前端Web模板”及其相关的知识点,特别是以"startbootstrap-sb-admin-2-master"为例,这是一款广泛使用的开源前端框架。 "前端框架"是指一组预先设计和组织好的代码库,它们简化了Web页面和应用...

    Go-beegowork前后分离项目框架

    《Go-beegoWork前后分离项目框架详解》 ...在实际应用中,我们需要充分理解和掌握beego的路由、模型、控制器等核心概念,同时熟悉jQuery EasyUI的各种组件和API,才能更好地利用这个框架,创造出满足需求的Web应用。

    jquery-1.4.2.js和jquery-1.4.2-vsdoc.js

    - **jQuery生态**:jQuery生态系统包括许多插件和框架,如jQuery UI、jQuery Mobile,它们扩展了jQuery的功能,满足了更广泛的开发需求。 总结,jQuery 1.4.2是JavaScript开发中的一个重要里程碑,它的API设计和...

    jquery ui 1.7.3值得收藏

    jQuery UI是jQuery项目的一个分支,专门用于构建交互式的用户界面,提供了一系列丰富的组件和功能,极大地简化了前端开发工作。 jQuery UI 1.7.3的发布日期虽然已经有些久远,但其稳定性和兼容性在当时堪称一流。这...

    web前端初级.pdf

    在轻量级框架开发应用章节,以jQuery为例,讲解了如何使用轻量级框架来简化JavaScript编程。jQuery是目前最流行的JavaScript库,它提供了一种简捷的方式来选择和操作DOM元素,实现动画效果,处理用户交互,以及发送...

    web前端工程师-.rar

    4. 前端框架:现代前端开发离不开框架的使用,常见的有React、Vue.js、Angular等。这些框架提供了一套完整的开发模式,简化了组件化开发、状态管理、路由控制等任务,提升了开发效率。 5. jQuery:虽然现代框架已经...

Global site tag (gtag.js) - Google Analytics