对比jQuery和Zepto

JavaScript库——jQuery和Zepto

jQuery是在Web上应用很普遍的JavaScript库，它提供了大量的工具和API函数，使用它的人至关广泛，使用的门槛也比较低。它的API语义对初学者很宽容，出现各类失误也不会抛出JavaScript错误。大多数jQuery方法都是可连接的，也就是说这些方法都会返回jQuery对象，因此能够把任意多个方法连接到一个DOM引用上。正因如此，为jQuery贡献代码的人不少，致使jQuery的每一个功能都有代价，代码库的不断膨胀，文件尺寸成为最大负担。jQuery2.0在这一点上，直接选择抛弃IE六、IE七、IE8，而这些代码占了jQuery1.9中的一大部分，不过不用担忧，jQuery2.0和1.9是兼容的，也就是说，在全部2.0不支持的浏览器上均可以条件化注释加载jQuery1.9。

<!—[if it IE 9]>

<script src=”jQuery-1.9.x.js”></script>

<![endif]-->

<--[if gte IE 9]><!-->

<script src=”jQuery-2.x.x.js”></script>

<!--<![endif]-->

jQuery的流行程度也是一个值得骄傲的地方，既然那么多的网站都在使用它，每一个网站单独引入它的意义不大，不必使用户每访问一个用了jQuery的网站都要下载相同的jQuery核心文件。因此Google在CDN（内容传递网站）上部署了jQuery，这样经过改善把jQuery引入网站的方式，达到为用户节约下载时间的目的。尽管仍是有不少网站仍把jQuery放在本身的网站上，但已有作够多的网站用上了Goole的CDN。若是用户第一次访问这个网站，也不用下载jQuery。这种方法对性能的改善至关有利，意味着这么作的网站越多，这种办法的收益也就越大。Goole的CDN用起来特别简单，只须要把脚原本源指向Goole的服务器就能够。

<script src=”//ajax.gooleapis.com/ajax/libs/jquery/1/jquery.min.js”><script>

上面的这段脚本是在请求最新的稳定版jQuery引入网站，但通常不要这样作，由于jQuery中的API会被废弃，特别是从1.9到2.0时，因此最好指明须要的版本。

<script src=”//ajax.gooleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js”><script>

这段代码在路径中指明要用jQuery的1.9.1版。这里被忽略的http协议是为了确保浏览器能够用页面所用的协议，这样能够避免浏览器抱怨所请求的资源协议不匹配。但若是使用file：///协议打开本地HTML文件，它将不起做用。

Zepto最初是为移动端开发的库，是jQuery的轻量级替代品，由于它的API和jQuery类似，而文件更小，对任何项目都是个不错的选择。Zepto最大的优点是它的文件大小，只有8k多一点，是目前功能完备的库中最小的一个，尽管不大，Zepto所提供的工具足以知足开发程序的须要。大多数在jQuery中·经常使用的API和和方法Zepto都有，Zepto中还有一些jQuery中没有的，而用一些定制的JavaScript就很容易作出来的API和方法。另外，由于Zepto的API大部分都能和jQuery兼容，因此用起来极其容易，若是熟悉jQuery，就能很容易掌握Zepto。你可用一样的方式重用jQuery中的不少方法，也能够方面地把方法串在一块儿获得更简洁的代码，甚至不用看它的文档。

针对移动端程序，Zepto还有一些基本的触摸事件能够用来作触摸屏交互，如：tap事件——tap，singleTap，doubleTap，longTap;

Swipe事件——swipe，swipeLeft，swipeRight，swipeUp，swipeDown。

可是有一点，Zepto是不支持IE浏览器的，这不是Zepto的开发者Thomas Fucks在跨浏览器问题上犯了迷糊，而是通过了认真考虑后为了下降文件尺寸而作出的决定，就像jQuery的团队在2.0版中再也不支持旧版的IE同样。

长久以来，IE的兼容性问题让无数开发人员深受其苦。它就是不按标准来，每一个大版本都有本身的怪癖。IE在较新版本中作出很大努力来解决这些兼容性问题。但事实上IE在处理一些JavaScript和DOM问题时仍然再用它本身的非标准方式，而且随着HTML5标准和特性的出现，它又被其余主要浏览器甩在了后面。

jQuery之类的大多数JavaScript库都在用额外的代码解决跨浏览器问题，然而为解决这个问题所编写的代码量至关可观。Zepto为了瘦身放弃这个问题。这对移动程序来讲是很好的，由于在移动终端上通常都不用担忧会碰到IE。但对桌面程序来讲这是个致命的问题。

由于Zepto使用jQuery句法，因此它在文档中建议把jQuery做为IE上的后备库。那样程序仍能在IE中，而其余浏览器则能享受到Zepto在文件大小上的优点，然而它们两个的API不是彻底兼容的，因此使用这种方法时必定要当心，并要作充分的测试。

固然，你能够彻底不用JavaScript库。即便像Zepto这么小的JavaScript库，也会让程序无故地膨胀起来。本身编写的JavaScript最大的好处是你只须要编写和引入须要的东西，而最大的弊端是这样须要更长的开发时间。按照定义，JavaScript库会包含程序中经常使用的不少功能，但每一个程序都不可能把全部的功能都用上。那些额外的，用不到的JavaScript就是没必要要的肿块。然而你必需要在文件大小和开发时间上做出选择，若是你历来没有从开头写过JavaScript程序，可能会低估整个程序所须要的开发时间。相信就算知道必需要写大量脚原本实现程序所需的所有功能，但你可能没考虑到为了支持多个浏览器所须要的工做量。

和跨浏览器的JS相比，CSS的跨浏览器问题简直就不值一提。早期的浏览器战争留下了各类稀奇古怪的问题，这些问题日益凸显，迫使你要为了避免同浏览器作不一样实现，这些处理方式也略有不一样。一个常见的例子就是跨浏览器时间处理器，好比onclick事件。全部现代浏览器都支持用addEvenListener绑定鼠标事件。

Var bt=document.getElementById(“bt”);

bt.addEventListener(“click”,function(e){

       alert(“this is a alert”);

})

 

而IE下的事件绑定的函数是attachEvent,它支持全系列的IE，但若是在Chrome等其余内核浏览器中使用这个函数去绑定事件，浏览器会报错。

Var bt=document.getElementById(“bt”);

bt.attachEvent(“onclick”,function(e){

       alert(“this is a alert”);

})

 

因此，开发中不存在绝对优点，合适地选择JavaScript库，或是使用原生JS都是要根据自身的开发需求来权衡的。