Zepto

Zepto

Zepto，是一个比较有争议的框架，最近一直在做移动端页面开发，一直在用这个框架，今天对于用了这么久的框架来聊聊这个Zepto如何。

Zepto是什么：

Zepto是一个轻量级的针对现代高级浏览器的JavaScript库，它与jquery有着类似的api。如果会用jquery，那么也会用zepto，从这里了解到，Zepto是一边比较新的框架，它比jquery小很多，只有20多KB，实现了，jquery只能说一部分的功能。

Zepto-jquery对比：

Zepto号称迷你版jQuery，并且成为移动端dom操作库的首选

事实上zepto很多时候只是借用了jQuery的名气，保持了与其基本一致的API，其内部实现早已面目全非！

艾伦分析了jQuery，我就暂时没有那个本事分析jQuery，这里就恬不知耻说说自己对zepto的源码理解。

核心代码1000行不到，快速占领了移动端的市场。

也如艾伦所言，jQuery狭义的讲其实就是dom操作库

zepto将这点发扬光大，并且抛弃了浏览器兼容的包袱，甚至CSS3的前缀都不给加，这些因素造就了zepto小的事实。

Zepto-jquery性能上：

一直特别纠结zepto性能这个问题，有的人说zepto体积小，性能好，然后又看国外的一个帖子，说除了体积小，性能比jquery差很多。各个人的说法不一，不清楚到底选择哪个好。经过在pc浏览器和手机浏览器上测试，zepto的效率确实很低，除了体积小，没有任何优势，jquery的性能差不多是zepto的2.5倍。一定要消除这个观念，不是体积很小，效率就很高。

Zepto的一些核心的组件是哪些呢：

zepto现在也采用了模块拆分，这样读起来其实代码十分清晰，门槛也低了很多，整个zepto核心模块保持在900行以内

看他很好的发扬了dom库特点便是因为这900行基本在干dom操作的活

核心模块有以下部分组成

①闭包变量、工具类方法定义

这个部分主要为后面服务，比如说什么isFunction/isPlainObject/children

其中有一个比较特别的变量是

zepto = {};

②zepto与jQuery的$

zepto第二阶段干的事情便是定义了一个类

$ = function(selector, context){
  return zepto.init(selector, context)
}

③zepto与jQuery的$.fn

我们知道jQuery的$.fn指向的是jQuery.prototype的原型对象，而zepto的fn就是一个简单对象

$.fn={};

这里有段非常关键的代码是：

domArr.__proto__ = $.fn；

还有一些就不一一写出来了。

既然Zepto这样那为为什么还要用它呢：

他适用于移动设备已经桌面浏览器除了ie系列的

他兼容jquery的API，所以学起来或用起来并不吃力。他比jquery的优势在于

1.他够小，只有21k左右，功能俱全(这里的功能齐全只是说再实现一些比较实用的效果和接口上等等)。

2.增加了移动设备的触摸等事件，不需要再次引入其他手机框架如jquerymobile。

3.虽然不兼容ie但是提供了一个兼容方法

总结：Zepto确实是是一个很轻量级的移动端js框架，去除了jquery那么繁重的和用不到的功能模块，在基于jquery的基础上跟进出来，能大部分的时间移动端所需要的效果和功能，学习和入手快，不方便的地方，在于没有jquery或者jquerymobile强大已经css3动画效果，游览器的兼容，等等，一个框架的新起总有他的好处和问题所以还是需要看个人的需要来定。